64
I E-health Web Application Framework and Platform Based On The Cloud Technology Master Thesis Spring 2013 School of Health and Society Department Design and Computer Science Writer Writer Writer Writer Jun Lu Song Zhang Instructor Instructor Instructor Instructor Eric Chen Examiner Examiner Examiner Examiner Dawit Mengistu

Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

  • Upload
    others

  • View
    4

  • Download
    0

Embed Size (px)

Citation preview

Page 1: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

I

E-health Web ApplicationFramework and Platform

Based On The CloudTechnology

Master ThesisSpring 2013

School of Health and SocietyDepartment Design and Computer Science

WriterWriterWriterWriterJun Lu

Song Zhang

InstructorInstructorInstructorInstructorEric Chen

ExaminerExaminerExaminerExaminerDawit Mengistu

II

School of Health and SocietyDepartment Design and Computer ScienceKristianstad UniversitySE-291 88 KristianstadSweden

AuthorAuthorAuthorAuthor ProgramProgramProgramProgram andandandandYearYearYearYearJun Lu Song Zhang Embedded Systems 2012

InstructorInstructorInstructorInstructorDrEric Chen HKr

ExaminationExaminationExaminationExaminationThis graduation work on 15 higher educations credits is a part of the requirements fora Degree of Master in Embedded Systems (as specified in the English translation)

TitleTitleTitleTitle

E-health Web Application Framework and Platform Based On The Cloud

Technology

AbstractAbstractAbstractAbstractThis project deals with E-health web application framework cloud platform andresponsive web design which aim to adjust the presentation on mobile devices Thiswork presents the whole development process of the self-care management web-appframework which provides instructive supports for future other E-health fieldapplication The report consists of the following main parts analysis design andimplementation and evaluation Literature review and internet search are mainmethods for making an investigation on existing systems and related works Aprototype is developed by using Net CSS3 Java script and HTML5 technologiesThe system test and evaluation is made to show the systemrsquos usability

LanguageLanguageLanguageLanguageEnglish

Approved by

_____________________________________XXX DateExaminer

III

TableTableTableTable ofofofof ContentsContentsContentsContents PagePagePagePageDocumentDocumentDocumentDocument pagepagepagepage IIIIAbstractAbstractAbstractAbstract IIIIIIIITableTableTableTable ofofofof ContentsContentsContentsContents IIIIIIIIIIII1111 IntroductionIntroductionIntroductionIntroduction 1111

11 Background 112 Aim and purpose113 Report organization 214 Acknowledgement3

2222 StudyStudyStudyStudy onononon E-healthE-healthE-healthE-health444421 Introduction 422 Advantages of E-health 423 Barriers to E-Health524 E-Health in EU 525 E-health Requirement6

3333 LiteratureLiteratureLiteratureLiterature RRRRevieweviewevieweview onononon ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb DesignDesignDesignDesign andandandand RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline 777731 Methods and Resources732 Literature Search 833 Analysis 834 Qualitative findings 935 RWD Guideline 1436 Conclusion of RWD 17

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy 1818181841 Introduction 1842 Physical Safeguards1843 Technical Safeguards1944 Security and privacy Guideline 1945 General Login and Access Control Structure 21

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform2525252551 Introduction 2552 Cloud benefit 2653 Cloud limitation2654 Cloud Platform selection27

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation2929292961 Introduction 2962 System descriptionampRequirement analysis2963 Investigation and previous preparation 3064 Selection of operating systems tools and database3165 System Architecture Design 3466 System functions and Module implementation3467 Security and Privacy3768 Responsive Web design methods application4169 Encountered problems and solutions43

IV

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation4545454571 Performance Testing4572 Black Box testing 48

8888 ConclusionConclusionConclusionConclusion505050509999 FutureFutureFutureFutureWorkWorkWorkWork5151515110101010 ReferencesReferencesReferencesReferences 5252525211111111 EnclosuresEnclosuresEnclosuresEnclosures55555555

Enclosure 1 Articles for literature review55Enclosure 2 Report for responsive web load speed simulation56Enclosure 3 Abbreviations 57Enclosure 4 Meeting Investigation59

1

1111 IntroductionIntroductionIntroductionIntroduction

11111111 BackgroundBackgroundBackgroundBackground

With the rapid development of smart phones and mobile devices[1] it becomes verypopular that people more prefer to access the information through this flexible waySo the requirement of proper interface according to different devices become a hottopic and the goal will motivate the use of RWD[2](Responsive Web Design) It aimsat crafting sites to provide an optimal viewing experience in easy reading andnavigation with a minimum of resizing panning and scrolling across a wide range ofdevices such as from desktop computer monitors to mobile phones Whatrsquos more nowdays E-health has gradually aroused great attention all over world And the modernday healthcare needs and delivery is complex and the use of ICT[3] has made somepositive impact in attending to such needs that e-health applications require Theproject is about E-health[4] web application framework and responsive web designwhich base on the cloud platform This idea comes from instructor Dr Eric Chenrsquosproject proposal Though there are some existing researches in above fields there isless or almost none related work which combines these fields to provide a basic framespecifically focusing on the e-health Right information at right time saves lives Soan E-health web application framework and platform based on the cloud is a part ofinformation and communication technology supported self-care system for thediabetes This project will closely collaborate with another group working datacollection and presentation application The new related work in above fields worth tobe done from the view of reality and research

12121212 AimAimAimAim andandandand purposepurposepurposepurpose

The main purpose of the project is to develop an E-health-field system basic framecombined with the responsive web design technology based on the cloud server Itoffers a basic common model which can be used by some special E-health applicationdevelopment in the future It provides a worth guideline on E-health web applicationfor people self-care management And the model is designed to be applied to developa specific application aiming to the diabetes self-care managementThe projectrsquos main work is as following

121121121121 SystematicSystematicSystematicSystematic literatureliteratureliteratureliterature reviewreviewreviewreview andandandand InternetInternetInternetInternet searchsearchsearchsearchWe will do the literature review about the responsive web design in a systematic wayrecord the results and do the analysis on what others have done in the area so that wecan start the work based on the available results

2

122122122122 ToToToTo establishestablishestablishestablish anananan EEEE-health-health-health-health webwebwebweb applicationapplicationapplicationapplication frameframeframeframeThis project mainly focus on establishing a responsive e-health system frame to offera basic common model which can be used by some special e-health application in thefuture On one hand we should select a proper development platform and cloudplatform On the other hand the frame should focus on the security problem such asthe access control and data storage

123123123123 ToToToTo designdesigndesigndesign aaaa reasonablereasonablereasonablereasonable responsiveresponsiveresponsiveresponsive webwebwebweb designdesigndesigndesign methodmethodmethodmethodThe E-health frame will be developed by combining several technology (NETHTML5 JavaScript CSS ) Among these technologies CSS is responsible for theweb visual style on the device So we should improve and design a reasonable styletransformation method through learning the existing related CSS method And we tryto ensure the style can be transformed automatically and well compatibly applied intodifferent devices Then we will design a guideline about the it since the system willbe extended in the future

124124124124 ToToToTo SelectSelectSelectSelect thethethethe reasonablereasonablereasonablereasonable deploymentdeploymentdeploymentdeployment vendorvendorvendorvendor forforforfor EEEE----hhhhealthealthealthealthMany of the associates identified that selection of good vendor is the critical step forthe Health care before adopting cloud computing Selection of vendor needs properplanning and analysis and hospital must have to check the vendor backgroundservices they provided from how long they are providing the services and customersatisfaction about the vendor Good vendor will produce secure SLA[5]rsquos to thecustomer and it will produce good relationship between the customer and the vendorIf health sector selected good vendor vendor can produce secure SLArsquos to secure andshare the data between the hospitals So in this part many interviews and survey willbe done to help us to select a reasonable deployment model for E-Health

Due to the limitation of the project time the demo application is designed to bedeveloped as a web-app So the responsive web design part has been tried to fit withthe smart embedded devices to a large extent Some optimizations and the scopeextent of the application should be further improved to fix with the different deviceswell Moreover more functions will be added to the diabetes application according touserrsquos requirements the in the future

13131313 ReportReportReportReport organizationorganizationorganizationorganization

The report is divided into 11 chapters The first chapter introduces the background ofthe research and main purpose And next Chapter 2 introduces the development stateof the E-health and its advantage and disadvantage in detail Then in the Chapter 3 asystematic Literature review about the responsive web design will be done and theresult will be further analyzed to conclude a method to meet with the requirement ofthe framework In Chapter 4 the security problem will be discussed A flexible usermanagement and access permission control will be introduced in detail to providedesired privacy and security And in Chapter 5 a systematic comparison between

3

existing cloud platform and database will be done to select a most suitable vendorThen the core part of the project will be introduced in Chapter6 This part introducethe whole project development process in detail and some encountered problems andsolutions From Chapter 7 to 10 the applicationrsquos system test evaluation conclusionsome future works and quoted reference will be included Lastly in Charter 11 somecore codes and other common infrastructure will be attached

14141414 AcknowledgementAcknowledgementAcknowledgementAcknowledgement

The special thanks will be expressed to the instructor Dr Eric Chen weekly meetingand patient conduct guide us to get a obvious understanding of the project work and abetter application design He also arranged some meetings with Kerstin Blomqvistthe expert in diabetes field which help us to gain much professional advice and guideIn addition he helps us to organize and modify the reports with great patience Thenwe will express great thanks to the Dr Kerstin and her doctoral student for selflessprofessional guidance and helps Moreover thanks for the help and cooperation fromanother data collecting and presenting group QunYing Song and JingJing Xu Lastlywe will express our thanks to the examiner DrDawit Mengistu for his advice andevaluation The whole project can be realized successfully due to their inseparableefforts to a large extent

4

2222 StudyStudyStudyStudy onononon E-healthE-healthE-healthE-health

21212121 IntroductionIntroductionIntroductionIntroduction

There are many definitions for E-Health until now but still there is no consensus onone common definition This is because of its ubiquitous and dynamic nature TheE-health information are widely used with different meanings and purposes In ourwork we develop the E-health application mostly used for diabetes patient

Joaquin (2010) who is one of the World health organization members definedE-health as the use of information and communications technologies (ICT) in favor ofhealth and health-related fields containing health-care services health supervisionhealth literature and health self-management education knowledge and research andstated that E-health has the potential to greatly improve health service efficiency itshould expand or extend treatment delivery to more than thousands of patients indeveloping countries and also improve patient results[6] In another word Mitchell defined that ldquo the combined use of electroniccommunication and information technology in the health field need to be described bya new term The use in the health sector of digital data transmitted stored andretrieved electronically both at the local site and at a distance for clinical educationaland administrative purposes rdquo(Mitchell 1999) [7]Sweden America Britain and the rest of Europe has experienced a great proliferationof health care-related websites most of which present disinformation and misleadingguidance(Fogg et al 2001)[8] And research suggests that the E-health web usersexpress the strong desire to own a online website which is used for theirself-management and directly getting advice from the doctor So the self-managementand interoperability are mostly focused in our project

22222222 AdvantagesAdvantagesAdvantagesAdvantages ofofofof E-healthE-healthE-healthE-health

There are many advantages in using E-Health concepts One key example isElectronic Health Records Before E-health came into use we used paper basedsystem to record patient health data These paper based system may have errorswhile entering the patient records into papers Coming to E-health data storeelectronically and it is more simpler and efficient way of data storing (Haumlyrinen2008)[9] Grogan stated that there is an evidence to suggest that E-health providemore complete and error free methods for storing patient data (Grogan 2006)[10]

By using E-health there are many benefits to different people such as doctorspatients etc For example doctorrsquos orders can be placed electronically which avoidwrong elucidation of hand wrote orders And with the help of E-health most doctorsreduces the time of locating and reading patient health information To the patient

5

they can begin to be gradually aware of the importance of self-care managementMoreover it is also convenient for maintaining only with some experts in medical andapplication developers

23232323 BarriersBarriersBarriersBarriers totototo E-HealthE-HealthE-HealthE-Health

The followings list are the main barriers to E-health

231231231231 OperationalOperationalOperationalOperational BarriersBarriersBarriersBarriersThis area of concern relates to the interoperability of systems which e-Health aims toprovide (John 2009)[11] First a system has to be developed with an interfaceallowing existing computer system to communicate with new system which e-Healthwill introduce Second there must be a common standard electronic language to crosscommunicate between different healthcare organization about the medical data suchas patient records and hospital internal record There must be formal agreement onwhat the best method to communicate such data between organizations (Hill et al2007)[12]

232232232232 CostBenefitCostBenefitCostBenefitCostBenefit BarriersBarriersBarriersBarriersAs the name suggest it is the barrier related to the cost in implementing e-Healthsolutions whether it is feasible in-terms of cost wise ie do the benefit of e-Healthoutweigh the cost required to implement E-health From the technical side theimplementation of E-health solutions is clearly advantageous in comparison with pastmethods such as the paper-based record keeping systems but from the healthcareorganization side these benefits may not outweigh the cost of implementinge-Health solutions The cost of implementing e-Health solutions can be tens ofthousands of dollars and this does not even include the requirement of hiring teamsof IT professionals to support and maintain the software throughout its life cycle(Mearian 2010)[13]

22224444 E-HealthE-HealthE-HealthE-Health inininin EUEUEUEU

Most European governments have set up combined systems of healthcare insurancein which public compulsory health insurance coexists with private companies (whichare optional most of the time) Globally the European population is aging whichtranslates into an increasing demand for healthcare and an increased cost of treatmentOn a global basis many governments in Europe are transferring expenses from publicinsurance to private ones The ongoing economic crisis leads both governments andprivate bodies to be in demand for better cost optimization leading to a globallybetter governance of the healthcare system[14]

The combination of social and policy factors described in the previous section havealready created the basis for a strong European demand for E-Health services and

6

applications Based on an analysis undertaken by Capgemini Consulting in the contextof this project the European E-Health market was about at EUR14269 million in2008 year and it is also projected to reach EUR15619 million by 2012 it grows witha rate of 29 A per-country analysis of the results confirms that France GermanyItaly Spain and the United Kingdom are the principal European E-Health marketsHowever the analysis also confirms that over the next three years all nationalE-Health markets will experience some form of growth in this area [15]

22225555 E-healthE-healthE-healthE-health RequirementRequirementRequirementRequirement

Aiming to the specific field we should take the following main parts into account thatis the designing computing and data format

InteractionInteractionInteractionInteraction designdesigndesigndesign The E-health frame should meet different rolesrsquo requirement andaccess authority management which will be used as a basic model in some specificapplication in the future For example different roles such as diabetes patients doctorsand administrator can be created and the discussion between patients and doctorsshould be available Moreover the authenticated doctor can access the specified itemsof the patients which will solve the problem of security

UIUIUIUI designdesigndesigndesign the E-health website page should be shown concise so that it should becomfortable for the users administrators and developers and the responsive webdesign was used to fulfill the requirement which can be well suited to different typedevices with flexible screen such as the PC mobile phone etc

MobilityMobilityMobilityMobility andandandand powerfulpowerfulpowerfulpowerful computingcomputingcomputingcomputing capabilitiescapabilitiescapabilitiescapabilities The E-health website should bevisited at anyplace with anytime So the real-time interaction should be an importantissue and taken into account Additionally a powerful computing capability should beowned to solve the problem that if too many users access the website

DataDataDataData FormatFormatFormatFormat The data in the system should follow the medical standard format andrules such as the unit of glucose it is mmolL The medical words should be usedseriously

DataDataDataData StorageStorageStorageStorage Considering the security issue of the data storage such as the storageformat and privacy information data protection A proper database with highersecurity level should be choose which will be further discussed in the Chapter 55

DataDataDataData PresentationPresentationPresentationPresentation In order to provide a concise and beautiful view of the dataThedata presentation can combine with different presentation formats such as histogramand table etc according the medical data requirement

7

3333 LiteratureLiteratureLiteratureLiterature RRRRevieweviewevieweview onononon ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb DesigDesigDesigDesignnnn andandandand

RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

31313131 MethodsMethodsMethodsMethods andandandand ResourcesResourcesResourcesResources

A systematic research is taken to generate meaningful result of our purpose Two mainsteps were taken to search and evaluate the results(1) Gathering sources it contains abroad search using the most relevant key words for more potential hits and whatrsquosmore a good literature review requires that you isolate key themes or issues related toyour own research interests so more restriction were added to filter the articles(2)Evaluating sources reading all the final articles with some questions kept inmindDoes the evidence support the conclusion Is the argument or evidencecomplete Does all research arrive at the same conclusion or are there differing Atlast eliminating unuseful articles with these merit and classifying all the remainedarticlesIn the first place Springer database were chosen for this literature review studyrsquos datasource it is widely used in the computer science research study and maintained bySpringer-Verlag which is one of the most famous science and technology publishcompany But in the Springer database the articles which are related to ComputerScience mostly are not related to E-health so the Google Scholar were also chosen todo this research All the key words were divided into four categories ldquoTopicrdquoldquoTechnologyrdquo ldquoProgramming Languagerdquo ldquoDevicerdquo

8

32323232 LiteratureLiteratureLiteratureLiterature SearchSearchSearchSearch

The following flow diagram show the literature review process

Figure 1 Articles Search Process

33333333 AnalysisAnalysisAnalysisAnalysis

331331331331 PublishingPublishingPublishingPublishing yearyearyearyearTable 1 Table for count of each publishing yearrsquos articlePublishingPublishingPublishingPublishing yearyearyearyear CountCountCountCount

2013 22012 62011 62010 6

2000-2010 0

The table above shows the count of reports in each publishing year The attention onresponsive web design rises from year 2010 when Ethan Marcotte put forward theconcept of RWD then it keeps the main trend and become to be popular as thenumber remain stable per year until to now

Springer database Google Scholar databaseKey words are divided into four categories(1) Topic ldquoresponsive web designrdquo(2) Technology ldquomedia-queryrdquo ldquoflexible gridrdquo(3) Programming Language ldquoNETrdquo ldquoHTML5rdquo ldquoCSS3rdquo(4) Device ldquohandheldrdquo ldquosmart-phonerdquoldquolaptoprdquo

179 articles were found (73 articles from Springerdatabase 106 articles were found from Google)

136 articles can find full text

43 articles discardedsince no full text found

71 articles were concerning about computer-basedtechnologies

20 articles were concerning about responsive webdesign

65 articles discardedsince no mention aboutcomputer technologies

51 articles discardedsince no met about

responsive web design

9

332332332332 PublishingPublishingPublishingPublishing countrycountrycountrycountryTable 2 Table for count of each countryrsquos article

PublishingPublishingPublishingPublishing countrycountrycountrycountry CountCountCountCountAustria 1Finland 2Germany 5Greece 1USA 4UK 3

Norway 1Italy 1

Sweden 2

From table above it indicates that Germany Smashing magazine put the mostefforts on responsive web design among all countries 5 related reports arepublished in Germany It can be seen that USA and UK also work hard on responsiveweb design with 4 and 3 research reports respectively The number of reports whichpublished in Europe and UK is 15 Especially Central European countries and Nordiccountries have made a major contribution to improve responsive web development 12published research papers However looking back to Asia no result are found in theresult set

33334444 QualitativeQualitativeQualitativeQualitative findingsfindingsfindingsfindings

With increasing Web users using handheld device to browse Web sites and apps Webdesigners and developers must make sure that their creations look good and workwell on mobile devices just like on traditional desktop computers

341341341341 TheTheTheThe developmentdevelopmentdevelopmentdevelopment ofofofof mobilemobilemobilemobile devicedevicedevicedevice marketmarketmarketmarketNowadays There is a large amount of site traffic comes from mobiledevicesmdashnamely smart phones and tablets(mainly the iPhone and iPad)mdashin additionto traditional personal computers Across the world mobile devices now account formore than 12 percent of Internet traffic in 2012 and this is increasing much fasterthan desktop computer and laptop Internet traffic In nations with high smart-phonepenetration the fraction of mobile Web traffic is sufficiently higher Whatrsquos more thisdata is expected to increase significantly over the next 10 years as smart-phonesdevelop and mature both in hardware and software and adoption which picks up inSouth America Asia and Africa[16]

Google company predicts that mobile devices will drive travel searches up by 15 -25 in 2013[17]

10

NASDAQ SCOR has reported that in the United State 51 of smart-phone ownersare using these handheld devices to access travel information[18]

Responsive Web Design has been cited as the No1 web design and developmenttrend for 2013 by the net magazine[19]

It is a real fact that the Smart-phone sales surpassed PC throughout the decade All ofthese are secondary in comparison to the fact that simple and clearly view in handhelddevice is needed to exist in the market of the future The figure 1 below shows thedevelopment of the mobile market

Figure 2 The Development Of Mobile Market[20]

From figure 1 we can draw the conclusion that mobile traffic is increasing incrediblyfast People check their email on mobile device first more and more people wouldlike to use high end and fast systemdevices(it is clear that the user of iPad and iPhoneoccupied the most proportion)

342342342342 SurveySurveySurveySurvey ofofofof thethethethe E-healthE-healthE-healthE-health useruseruseruserrsquorsquorsquorsquossss requirementrequirementrequirementrequirementPeople are increasingly viewing their connection to the internet including theirgadgets as their lifeline Your patients keep their address book calendar and more ontheir mobile devices They rely on them Ensuring that your website is easilyaccessible and properly optimized for mobile devices just makes sense The trendtowards patients using their mobile devices to access information will only continueto grow In fact some sources claim that by 2015 nearly everyone will access theinternet from a mobile device With such a trend it makes sense to considerresponsive web design for your medical or dental website [21]

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 2: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

II

School of Health and SocietyDepartment Design and Computer ScienceKristianstad UniversitySE-291 88 KristianstadSweden

AuthorAuthorAuthorAuthor ProgramProgramProgramProgram andandandandYearYearYearYearJun Lu Song Zhang Embedded Systems 2012

InstructorInstructorInstructorInstructorDrEric Chen HKr

ExaminationExaminationExaminationExaminationThis graduation work on 15 higher educations credits is a part of the requirements fora Degree of Master in Embedded Systems (as specified in the English translation)

TitleTitleTitleTitle

E-health Web Application Framework and Platform Based On The Cloud

Technology

AbstractAbstractAbstractAbstractThis project deals with E-health web application framework cloud platform andresponsive web design which aim to adjust the presentation on mobile devices Thiswork presents the whole development process of the self-care management web-appframework which provides instructive supports for future other E-health fieldapplication The report consists of the following main parts analysis design andimplementation and evaluation Literature review and internet search are mainmethods for making an investigation on existing systems and related works Aprototype is developed by using Net CSS3 Java script and HTML5 technologiesThe system test and evaluation is made to show the systemrsquos usability

LanguageLanguageLanguageLanguageEnglish

Approved by

_____________________________________XXX DateExaminer

III

TableTableTableTable ofofofof ContentsContentsContentsContents PagePagePagePageDocumentDocumentDocumentDocument pagepagepagepage IIIIAbstractAbstractAbstractAbstract IIIIIIIITableTableTableTable ofofofof ContentsContentsContentsContents IIIIIIIIIIII1111 IntroductionIntroductionIntroductionIntroduction 1111

11 Background 112 Aim and purpose113 Report organization 214 Acknowledgement3

2222 StudyStudyStudyStudy onononon E-healthE-healthE-healthE-health444421 Introduction 422 Advantages of E-health 423 Barriers to E-Health524 E-Health in EU 525 E-health Requirement6

3333 LiteratureLiteratureLiteratureLiterature RRRRevieweviewevieweview onononon ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb DesignDesignDesignDesign andandandand RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline 777731 Methods and Resources732 Literature Search 833 Analysis 834 Qualitative findings 935 RWD Guideline 1436 Conclusion of RWD 17

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy 1818181841 Introduction 1842 Physical Safeguards1843 Technical Safeguards1944 Security and privacy Guideline 1945 General Login and Access Control Structure 21

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform2525252551 Introduction 2552 Cloud benefit 2653 Cloud limitation2654 Cloud Platform selection27

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation2929292961 Introduction 2962 System descriptionampRequirement analysis2963 Investigation and previous preparation 3064 Selection of operating systems tools and database3165 System Architecture Design 3466 System functions and Module implementation3467 Security and Privacy3768 Responsive Web design methods application4169 Encountered problems and solutions43

IV

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation4545454571 Performance Testing4572 Black Box testing 48

8888 ConclusionConclusionConclusionConclusion505050509999 FutureFutureFutureFutureWorkWorkWorkWork5151515110101010 ReferencesReferencesReferencesReferences 5252525211111111 EnclosuresEnclosuresEnclosuresEnclosures55555555

Enclosure 1 Articles for literature review55Enclosure 2 Report for responsive web load speed simulation56Enclosure 3 Abbreviations 57Enclosure 4 Meeting Investigation59

1

1111 IntroductionIntroductionIntroductionIntroduction

11111111 BackgroundBackgroundBackgroundBackground

With the rapid development of smart phones and mobile devices[1] it becomes verypopular that people more prefer to access the information through this flexible waySo the requirement of proper interface according to different devices become a hottopic and the goal will motivate the use of RWD[2](Responsive Web Design) It aimsat crafting sites to provide an optimal viewing experience in easy reading andnavigation with a minimum of resizing panning and scrolling across a wide range ofdevices such as from desktop computer monitors to mobile phones Whatrsquos more nowdays E-health has gradually aroused great attention all over world And the modernday healthcare needs and delivery is complex and the use of ICT[3] has made somepositive impact in attending to such needs that e-health applications require Theproject is about E-health[4] web application framework and responsive web designwhich base on the cloud platform This idea comes from instructor Dr Eric Chenrsquosproject proposal Though there are some existing researches in above fields there isless or almost none related work which combines these fields to provide a basic framespecifically focusing on the e-health Right information at right time saves lives Soan E-health web application framework and platform based on the cloud is a part ofinformation and communication technology supported self-care system for thediabetes This project will closely collaborate with another group working datacollection and presentation application The new related work in above fields worth tobe done from the view of reality and research

12121212 AimAimAimAim andandandand purposepurposepurposepurpose

The main purpose of the project is to develop an E-health-field system basic framecombined with the responsive web design technology based on the cloud server Itoffers a basic common model which can be used by some special E-health applicationdevelopment in the future It provides a worth guideline on E-health web applicationfor people self-care management And the model is designed to be applied to developa specific application aiming to the diabetes self-care managementThe projectrsquos main work is as following

121121121121 SystematicSystematicSystematicSystematic literatureliteratureliteratureliterature reviewreviewreviewreview andandandand InternetInternetInternetInternet searchsearchsearchsearchWe will do the literature review about the responsive web design in a systematic wayrecord the results and do the analysis on what others have done in the area so that wecan start the work based on the available results

2

122122122122 ToToToTo establishestablishestablishestablish anananan EEEE-health-health-health-health webwebwebweb applicationapplicationapplicationapplication frameframeframeframeThis project mainly focus on establishing a responsive e-health system frame to offera basic common model which can be used by some special e-health application in thefuture On one hand we should select a proper development platform and cloudplatform On the other hand the frame should focus on the security problem such asthe access control and data storage

123123123123 ToToToTo designdesigndesigndesign aaaa reasonablereasonablereasonablereasonable responsiveresponsiveresponsiveresponsive webwebwebweb designdesigndesigndesign methodmethodmethodmethodThe E-health frame will be developed by combining several technology (NETHTML5 JavaScript CSS ) Among these technologies CSS is responsible for theweb visual style on the device So we should improve and design a reasonable styletransformation method through learning the existing related CSS method And we tryto ensure the style can be transformed automatically and well compatibly applied intodifferent devices Then we will design a guideline about the it since the system willbe extended in the future

124124124124 ToToToTo SelectSelectSelectSelect thethethethe reasonablereasonablereasonablereasonable deploymentdeploymentdeploymentdeployment vendorvendorvendorvendor forforforfor EEEE----hhhhealthealthealthealthMany of the associates identified that selection of good vendor is the critical step forthe Health care before adopting cloud computing Selection of vendor needs properplanning and analysis and hospital must have to check the vendor backgroundservices they provided from how long they are providing the services and customersatisfaction about the vendor Good vendor will produce secure SLA[5]rsquos to thecustomer and it will produce good relationship between the customer and the vendorIf health sector selected good vendor vendor can produce secure SLArsquos to secure andshare the data between the hospitals So in this part many interviews and survey willbe done to help us to select a reasonable deployment model for E-Health

Due to the limitation of the project time the demo application is designed to bedeveloped as a web-app So the responsive web design part has been tried to fit withthe smart embedded devices to a large extent Some optimizations and the scopeextent of the application should be further improved to fix with the different deviceswell Moreover more functions will be added to the diabetes application according touserrsquos requirements the in the future

13131313 ReportReportReportReport organizationorganizationorganizationorganization

The report is divided into 11 chapters The first chapter introduces the background ofthe research and main purpose And next Chapter 2 introduces the development stateof the E-health and its advantage and disadvantage in detail Then in the Chapter 3 asystematic Literature review about the responsive web design will be done and theresult will be further analyzed to conclude a method to meet with the requirement ofthe framework In Chapter 4 the security problem will be discussed A flexible usermanagement and access permission control will be introduced in detail to providedesired privacy and security And in Chapter 5 a systematic comparison between

3

existing cloud platform and database will be done to select a most suitable vendorThen the core part of the project will be introduced in Chapter6 This part introducethe whole project development process in detail and some encountered problems andsolutions From Chapter 7 to 10 the applicationrsquos system test evaluation conclusionsome future works and quoted reference will be included Lastly in Charter 11 somecore codes and other common infrastructure will be attached

14141414 AcknowledgementAcknowledgementAcknowledgementAcknowledgement

The special thanks will be expressed to the instructor Dr Eric Chen weekly meetingand patient conduct guide us to get a obvious understanding of the project work and abetter application design He also arranged some meetings with Kerstin Blomqvistthe expert in diabetes field which help us to gain much professional advice and guideIn addition he helps us to organize and modify the reports with great patience Thenwe will express great thanks to the Dr Kerstin and her doctoral student for selflessprofessional guidance and helps Moreover thanks for the help and cooperation fromanother data collecting and presenting group QunYing Song and JingJing Xu Lastlywe will express our thanks to the examiner DrDawit Mengistu for his advice andevaluation The whole project can be realized successfully due to their inseparableefforts to a large extent

4

2222 StudyStudyStudyStudy onononon E-healthE-healthE-healthE-health

21212121 IntroductionIntroductionIntroductionIntroduction

There are many definitions for E-Health until now but still there is no consensus onone common definition This is because of its ubiquitous and dynamic nature TheE-health information are widely used with different meanings and purposes In ourwork we develop the E-health application mostly used for diabetes patient

Joaquin (2010) who is one of the World health organization members definedE-health as the use of information and communications technologies (ICT) in favor ofhealth and health-related fields containing health-care services health supervisionhealth literature and health self-management education knowledge and research andstated that E-health has the potential to greatly improve health service efficiency itshould expand or extend treatment delivery to more than thousands of patients indeveloping countries and also improve patient results[6] In another word Mitchell defined that ldquo the combined use of electroniccommunication and information technology in the health field need to be described bya new term The use in the health sector of digital data transmitted stored andretrieved electronically both at the local site and at a distance for clinical educationaland administrative purposes rdquo(Mitchell 1999) [7]Sweden America Britain and the rest of Europe has experienced a great proliferationof health care-related websites most of which present disinformation and misleadingguidance(Fogg et al 2001)[8] And research suggests that the E-health web usersexpress the strong desire to own a online website which is used for theirself-management and directly getting advice from the doctor So the self-managementand interoperability are mostly focused in our project

22222222 AdvantagesAdvantagesAdvantagesAdvantages ofofofof E-healthE-healthE-healthE-health

There are many advantages in using E-Health concepts One key example isElectronic Health Records Before E-health came into use we used paper basedsystem to record patient health data These paper based system may have errorswhile entering the patient records into papers Coming to E-health data storeelectronically and it is more simpler and efficient way of data storing (Haumlyrinen2008)[9] Grogan stated that there is an evidence to suggest that E-health providemore complete and error free methods for storing patient data (Grogan 2006)[10]

By using E-health there are many benefits to different people such as doctorspatients etc For example doctorrsquos orders can be placed electronically which avoidwrong elucidation of hand wrote orders And with the help of E-health most doctorsreduces the time of locating and reading patient health information To the patient

5

they can begin to be gradually aware of the importance of self-care managementMoreover it is also convenient for maintaining only with some experts in medical andapplication developers

23232323 BarriersBarriersBarriersBarriers totototo E-HealthE-HealthE-HealthE-Health

The followings list are the main barriers to E-health

231231231231 OperationalOperationalOperationalOperational BarriersBarriersBarriersBarriersThis area of concern relates to the interoperability of systems which e-Health aims toprovide (John 2009)[11] First a system has to be developed with an interfaceallowing existing computer system to communicate with new system which e-Healthwill introduce Second there must be a common standard electronic language to crosscommunicate between different healthcare organization about the medical data suchas patient records and hospital internal record There must be formal agreement onwhat the best method to communicate such data between organizations (Hill et al2007)[12]

232232232232 CostBenefitCostBenefitCostBenefitCostBenefit BarriersBarriersBarriersBarriersAs the name suggest it is the barrier related to the cost in implementing e-Healthsolutions whether it is feasible in-terms of cost wise ie do the benefit of e-Healthoutweigh the cost required to implement E-health From the technical side theimplementation of E-health solutions is clearly advantageous in comparison with pastmethods such as the paper-based record keeping systems but from the healthcareorganization side these benefits may not outweigh the cost of implementinge-Health solutions The cost of implementing e-Health solutions can be tens ofthousands of dollars and this does not even include the requirement of hiring teamsof IT professionals to support and maintain the software throughout its life cycle(Mearian 2010)[13]

22224444 E-HealthE-HealthE-HealthE-Health inininin EUEUEUEU

Most European governments have set up combined systems of healthcare insurancein which public compulsory health insurance coexists with private companies (whichare optional most of the time) Globally the European population is aging whichtranslates into an increasing demand for healthcare and an increased cost of treatmentOn a global basis many governments in Europe are transferring expenses from publicinsurance to private ones The ongoing economic crisis leads both governments andprivate bodies to be in demand for better cost optimization leading to a globallybetter governance of the healthcare system[14]

The combination of social and policy factors described in the previous section havealready created the basis for a strong European demand for E-Health services and

6

applications Based on an analysis undertaken by Capgemini Consulting in the contextof this project the European E-Health market was about at EUR14269 million in2008 year and it is also projected to reach EUR15619 million by 2012 it grows witha rate of 29 A per-country analysis of the results confirms that France GermanyItaly Spain and the United Kingdom are the principal European E-Health marketsHowever the analysis also confirms that over the next three years all nationalE-Health markets will experience some form of growth in this area [15]

22225555 E-healthE-healthE-healthE-health RequirementRequirementRequirementRequirement

Aiming to the specific field we should take the following main parts into account thatis the designing computing and data format

InteractionInteractionInteractionInteraction designdesigndesigndesign The E-health frame should meet different rolesrsquo requirement andaccess authority management which will be used as a basic model in some specificapplication in the future For example different roles such as diabetes patients doctorsand administrator can be created and the discussion between patients and doctorsshould be available Moreover the authenticated doctor can access the specified itemsof the patients which will solve the problem of security

UIUIUIUI designdesigndesigndesign the E-health website page should be shown concise so that it should becomfortable for the users administrators and developers and the responsive webdesign was used to fulfill the requirement which can be well suited to different typedevices with flexible screen such as the PC mobile phone etc

MobilityMobilityMobilityMobility andandandand powerfulpowerfulpowerfulpowerful computingcomputingcomputingcomputing capabilitiescapabilitiescapabilitiescapabilities The E-health website should bevisited at anyplace with anytime So the real-time interaction should be an importantissue and taken into account Additionally a powerful computing capability should beowned to solve the problem that if too many users access the website

DataDataDataData FormatFormatFormatFormat The data in the system should follow the medical standard format andrules such as the unit of glucose it is mmolL The medical words should be usedseriously

DataDataDataData StorageStorageStorageStorage Considering the security issue of the data storage such as the storageformat and privacy information data protection A proper database with highersecurity level should be choose which will be further discussed in the Chapter 55

DataDataDataData PresentationPresentationPresentationPresentation In order to provide a concise and beautiful view of the dataThedata presentation can combine with different presentation formats such as histogramand table etc according the medical data requirement

7

3333 LiteratureLiteratureLiteratureLiterature RRRRevieweviewevieweview onononon ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb DesigDesigDesigDesignnnn andandandand

RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

31313131 MethodsMethodsMethodsMethods andandandand ResourcesResourcesResourcesResources

A systematic research is taken to generate meaningful result of our purpose Two mainsteps were taken to search and evaluate the results(1) Gathering sources it contains abroad search using the most relevant key words for more potential hits and whatrsquosmore a good literature review requires that you isolate key themes or issues related toyour own research interests so more restriction were added to filter the articles(2)Evaluating sources reading all the final articles with some questions kept inmindDoes the evidence support the conclusion Is the argument or evidencecomplete Does all research arrive at the same conclusion or are there differing Atlast eliminating unuseful articles with these merit and classifying all the remainedarticlesIn the first place Springer database were chosen for this literature review studyrsquos datasource it is widely used in the computer science research study and maintained bySpringer-Verlag which is one of the most famous science and technology publishcompany But in the Springer database the articles which are related to ComputerScience mostly are not related to E-health so the Google Scholar were also chosen todo this research All the key words were divided into four categories ldquoTopicrdquoldquoTechnologyrdquo ldquoProgramming Languagerdquo ldquoDevicerdquo

8

32323232 LiteratureLiteratureLiteratureLiterature SearchSearchSearchSearch

The following flow diagram show the literature review process

Figure 1 Articles Search Process

33333333 AnalysisAnalysisAnalysisAnalysis

331331331331 PublishingPublishingPublishingPublishing yearyearyearyearTable 1 Table for count of each publishing yearrsquos articlePublishingPublishingPublishingPublishing yearyearyearyear CountCountCountCount

2013 22012 62011 62010 6

2000-2010 0

The table above shows the count of reports in each publishing year The attention onresponsive web design rises from year 2010 when Ethan Marcotte put forward theconcept of RWD then it keeps the main trend and become to be popular as thenumber remain stable per year until to now

Springer database Google Scholar databaseKey words are divided into four categories(1) Topic ldquoresponsive web designrdquo(2) Technology ldquomedia-queryrdquo ldquoflexible gridrdquo(3) Programming Language ldquoNETrdquo ldquoHTML5rdquo ldquoCSS3rdquo(4) Device ldquohandheldrdquo ldquosmart-phonerdquoldquolaptoprdquo

179 articles were found (73 articles from Springerdatabase 106 articles were found from Google)

136 articles can find full text

43 articles discardedsince no full text found

71 articles were concerning about computer-basedtechnologies

20 articles were concerning about responsive webdesign

65 articles discardedsince no mention aboutcomputer technologies

51 articles discardedsince no met about

responsive web design

9

332332332332 PublishingPublishingPublishingPublishing countrycountrycountrycountryTable 2 Table for count of each countryrsquos article

PublishingPublishingPublishingPublishing countrycountrycountrycountry CountCountCountCountAustria 1Finland 2Germany 5Greece 1USA 4UK 3

Norway 1Italy 1

Sweden 2

From table above it indicates that Germany Smashing magazine put the mostefforts on responsive web design among all countries 5 related reports arepublished in Germany It can be seen that USA and UK also work hard on responsiveweb design with 4 and 3 research reports respectively The number of reports whichpublished in Europe and UK is 15 Especially Central European countries and Nordiccountries have made a major contribution to improve responsive web development 12published research papers However looking back to Asia no result are found in theresult set

33334444 QualitativeQualitativeQualitativeQualitative findingsfindingsfindingsfindings

With increasing Web users using handheld device to browse Web sites and apps Webdesigners and developers must make sure that their creations look good and workwell on mobile devices just like on traditional desktop computers

341341341341 TheTheTheThe developmentdevelopmentdevelopmentdevelopment ofofofof mobilemobilemobilemobile devicedevicedevicedevice marketmarketmarketmarketNowadays There is a large amount of site traffic comes from mobiledevicesmdashnamely smart phones and tablets(mainly the iPhone and iPad)mdashin additionto traditional personal computers Across the world mobile devices now account formore than 12 percent of Internet traffic in 2012 and this is increasing much fasterthan desktop computer and laptop Internet traffic In nations with high smart-phonepenetration the fraction of mobile Web traffic is sufficiently higher Whatrsquos more thisdata is expected to increase significantly over the next 10 years as smart-phonesdevelop and mature both in hardware and software and adoption which picks up inSouth America Asia and Africa[16]

Google company predicts that mobile devices will drive travel searches up by 15 -25 in 2013[17]

10

NASDAQ SCOR has reported that in the United State 51 of smart-phone ownersare using these handheld devices to access travel information[18]

Responsive Web Design has been cited as the No1 web design and developmenttrend for 2013 by the net magazine[19]

It is a real fact that the Smart-phone sales surpassed PC throughout the decade All ofthese are secondary in comparison to the fact that simple and clearly view in handhelddevice is needed to exist in the market of the future The figure 1 below shows thedevelopment of the mobile market

Figure 2 The Development Of Mobile Market[20]

From figure 1 we can draw the conclusion that mobile traffic is increasing incrediblyfast People check their email on mobile device first more and more people wouldlike to use high end and fast systemdevices(it is clear that the user of iPad and iPhoneoccupied the most proportion)

342342342342 SurveySurveySurveySurvey ofofofof thethethethe E-healthE-healthE-healthE-health useruseruseruserrsquorsquorsquorsquossss requirementrequirementrequirementrequirementPeople are increasingly viewing their connection to the internet including theirgadgets as their lifeline Your patients keep their address book calendar and more ontheir mobile devices They rely on them Ensuring that your website is easilyaccessible and properly optimized for mobile devices just makes sense The trendtowards patients using their mobile devices to access information will only continueto grow In fact some sources claim that by 2015 nearly everyone will access theinternet from a mobile device With such a trend it makes sense to considerresponsive web design for your medical or dental website [21]

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 3: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

III

TableTableTableTable ofofofof ContentsContentsContentsContents PagePagePagePageDocumentDocumentDocumentDocument pagepagepagepage IIIIAbstractAbstractAbstractAbstract IIIIIIIITableTableTableTable ofofofof ContentsContentsContentsContents IIIIIIIIIIII1111 IntroductionIntroductionIntroductionIntroduction 1111

11 Background 112 Aim and purpose113 Report organization 214 Acknowledgement3

2222 StudyStudyStudyStudy onononon E-healthE-healthE-healthE-health444421 Introduction 422 Advantages of E-health 423 Barriers to E-Health524 E-Health in EU 525 E-health Requirement6

3333 LiteratureLiteratureLiteratureLiterature RRRRevieweviewevieweview onononon ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb DesignDesignDesignDesign andandandand RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline 777731 Methods and Resources732 Literature Search 833 Analysis 834 Qualitative findings 935 RWD Guideline 1436 Conclusion of RWD 17

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy 1818181841 Introduction 1842 Physical Safeguards1843 Technical Safeguards1944 Security and privacy Guideline 1945 General Login and Access Control Structure 21

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform2525252551 Introduction 2552 Cloud benefit 2653 Cloud limitation2654 Cloud Platform selection27

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation2929292961 Introduction 2962 System descriptionampRequirement analysis2963 Investigation and previous preparation 3064 Selection of operating systems tools and database3165 System Architecture Design 3466 System functions and Module implementation3467 Security and Privacy3768 Responsive Web design methods application4169 Encountered problems and solutions43

IV

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation4545454571 Performance Testing4572 Black Box testing 48

8888 ConclusionConclusionConclusionConclusion505050509999 FutureFutureFutureFutureWorkWorkWorkWork5151515110101010 ReferencesReferencesReferencesReferences 5252525211111111 EnclosuresEnclosuresEnclosuresEnclosures55555555

Enclosure 1 Articles for literature review55Enclosure 2 Report for responsive web load speed simulation56Enclosure 3 Abbreviations 57Enclosure 4 Meeting Investigation59

1

1111 IntroductionIntroductionIntroductionIntroduction

11111111 BackgroundBackgroundBackgroundBackground

With the rapid development of smart phones and mobile devices[1] it becomes verypopular that people more prefer to access the information through this flexible waySo the requirement of proper interface according to different devices become a hottopic and the goal will motivate the use of RWD[2](Responsive Web Design) It aimsat crafting sites to provide an optimal viewing experience in easy reading andnavigation with a minimum of resizing panning and scrolling across a wide range ofdevices such as from desktop computer monitors to mobile phones Whatrsquos more nowdays E-health has gradually aroused great attention all over world And the modernday healthcare needs and delivery is complex and the use of ICT[3] has made somepositive impact in attending to such needs that e-health applications require Theproject is about E-health[4] web application framework and responsive web designwhich base on the cloud platform This idea comes from instructor Dr Eric Chenrsquosproject proposal Though there are some existing researches in above fields there isless or almost none related work which combines these fields to provide a basic framespecifically focusing on the e-health Right information at right time saves lives Soan E-health web application framework and platform based on the cloud is a part ofinformation and communication technology supported self-care system for thediabetes This project will closely collaborate with another group working datacollection and presentation application The new related work in above fields worth tobe done from the view of reality and research

12121212 AimAimAimAim andandandand purposepurposepurposepurpose

The main purpose of the project is to develop an E-health-field system basic framecombined with the responsive web design technology based on the cloud server Itoffers a basic common model which can be used by some special E-health applicationdevelopment in the future It provides a worth guideline on E-health web applicationfor people self-care management And the model is designed to be applied to developa specific application aiming to the diabetes self-care managementThe projectrsquos main work is as following

121121121121 SystematicSystematicSystematicSystematic literatureliteratureliteratureliterature reviewreviewreviewreview andandandand InternetInternetInternetInternet searchsearchsearchsearchWe will do the literature review about the responsive web design in a systematic wayrecord the results and do the analysis on what others have done in the area so that wecan start the work based on the available results

2

122122122122 ToToToTo establishestablishestablishestablish anananan EEEE-health-health-health-health webwebwebweb applicationapplicationapplicationapplication frameframeframeframeThis project mainly focus on establishing a responsive e-health system frame to offera basic common model which can be used by some special e-health application in thefuture On one hand we should select a proper development platform and cloudplatform On the other hand the frame should focus on the security problem such asthe access control and data storage

123123123123 ToToToTo designdesigndesigndesign aaaa reasonablereasonablereasonablereasonable responsiveresponsiveresponsiveresponsive webwebwebweb designdesigndesigndesign methodmethodmethodmethodThe E-health frame will be developed by combining several technology (NETHTML5 JavaScript CSS ) Among these technologies CSS is responsible for theweb visual style on the device So we should improve and design a reasonable styletransformation method through learning the existing related CSS method And we tryto ensure the style can be transformed automatically and well compatibly applied intodifferent devices Then we will design a guideline about the it since the system willbe extended in the future

124124124124 ToToToTo SelectSelectSelectSelect thethethethe reasonablereasonablereasonablereasonable deploymentdeploymentdeploymentdeployment vendorvendorvendorvendor forforforfor EEEE----hhhhealthealthealthealthMany of the associates identified that selection of good vendor is the critical step forthe Health care before adopting cloud computing Selection of vendor needs properplanning and analysis and hospital must have to check the vendor backgroundservices they provided from how long they are providing the services and customersatisfaction about the vendor Good vendor will produce secure SLA[5]rsquos to thecustomer and it will produce good relationship between the customer and the vendorIf health sector selected good vendor vendor can produce secure SLArsquos to secure andshare the data between the hospitals So in this part many interviews and survey willbe done to help us to select a reasonable deployment model for E-Health

Due to the limitation of the project time the demo application is designed to bedeveloped as a web-app So the responsive web design part has been tried to fit withthe smart embedded devices to a large extent Some optimizations and the scopeextent of the application should be further improved to fix with the different deviceswell Moreover more functions will be added to the diabetes application according touserrsquos requirements the in the future

13131313 ReportReportReportReport organizationorganizationorganizationorganization

The report is divided into 11 chapters The first chapter introduces the background ofthe research and main purpose And next Chapter 2 introduces the development stateof the E-health and its advantage and disadvantage in detail Then in the Chapter 3 asystematic Literature review about the responsive web design will be done and theresult will be further analyzed to conclude a method to meet with the requirement ofthe framework In Chapter 4 the security problem will be discussed A flexible usermanagement and access permission control will be introduced in detail to providedesired privacy and security And in Chapter 5 a systematic comparison between

3

existing cloud platform and database will be done to select a most suitable vendorThen the core part of the project will be introduced in Chapter6 This part introducethe whole project development process in detail and some encountered problems andsolutions From Chapter 7 to 10 the applicationrsquos system test evaluation conclusionsome future works and quoted reference will be included Lastly in Charter 11 somecore codes and other common infrastructure will be attached

14141414 AcknowledgementAcknowledgementAcknowledgementAcknowledgement

The special thanks will be expressed to the instructor Dr Eric Chen weekly meetingand patient conduct guide us to get a obvious understanding of the project work and abetter application design He also arranged some meetings with Kerstin Blomqvistthe expert in diabetes field which help us to gain much professional advice and guideIn addition he helps us to organize and modify the reports with great patience Thenwe will express great thanks to the Dr Kerstin and her doctoral student for selflessprofessional guidance and helps Moreover thanks for the help and cooperation fromanother data collecting and presenting group QunYing Song and JingJing Xu Lastlywe will express our thanks to the examiner DrDawit Mengistu for his advice andevaluation The whole project can be realized successfully due to their inseparableefforts to a large extent

4

2222 StudyStudyStudyStudy onononon E-healthE-healthE-healthE-health

21212121 IntroductionIntroductionIntroductionIntroduction

There are many definitions for E-Health until now but still there is no consensus onone common definition This is because of its ubiquitous and dynamic nature TheE-health information are widely used with different meanings and purposes In ourwork we develop the E-health application mostly used for diabetes patient

Joaquin (2010) who is one of the World health organization members definedE-health as the use of information and communications technologies (ICT) in favor ofhealth and health-related fields containing health-care services health supervisionhealth literature and health self-management education knowledge and research andstated that E-health has the potential to greatly improve health service efficiency itshould expand or extend treatment delivery to more than thousands of patients indeveloping countries and also improve patient results[6] In another word Mitchell defined that ldquo the combined use of electroniccommunication and information technology in the health field need to be described bya new term The use in the health sector of digital data transmitted stored andretrieved electronically both at the local site and at a distance for clinical educationaland administrative purposes rdquo(Mitchell 1999) [7]Sweden America Britain and the rest of Europe has experienced a great proliferationof health care-related websites most of which present disinformation and misleadingguidance(Fogg et al 2001)[8] And research suggests that the E-health web usersexpress the strong desire to own a online website which is used for theirself-management and directly getting advice from the doctor So the self-managementand interoperability are mostly focused in our project

22222222 AdvantagesAdvantagesAdvantagesAdvantages ofofofof E-healthE-healthE-healthE-health

There are many advantages in using E-Health concepts One key example isElectronic Health Records Before E-health came into use we used paper basedsystem to record patient health data These paper based system may have errorswhile entering the patient records into papers Coming to E-health data storeelectronically and it is more simpler and efficient way of data storing (Haumlyrinen2008)[9] Grogan stated that there is an evidence to suggest that E-health providemore complete and error free methods for storing patient data (Grogan 2006)[10]

By using E-health there are many benefits to different people such as doctorspatients etc For example doctorrsquos orders can be placed electronically which avoidwrong elucidation of hand wrote orders And with the help of E-health most doctorsreduces the time of locating and reading patient health information To the patient

5

they can begin to be gradually aware of the importance of self-care managementMoreover it is also convenient for maintaining only with some experts in medical andapplication developers

23232323 BarriersBarriersBarriersBarriers totototo E-HealthE-HealthE-HealthE-Health

The followings list are the main barriers to E-health

231231231231 OperationalOperationalOperationalOperational BarriersBarriersBarriersBarriersThis area of concern relates to the interoperability of systems which e-Health aims toprovide (John 2009)[11] First a system has to be developed with an interfaceallowing existing computer system to communicate with new system which e-Healthwill introduce Second there must be a common standard electronic language to crosscommunicate between different healthcare organization about the medical data suchas patient records and hospital internal record There must be formal agreement onwhat the best method to communicate such data between organizations (Hill et al2007)[12]

232232232232 CostBenefitCostBenefitCostBenefitCostBenefit BarriersBarriersBarriersBarriersAs the name suggest it is the barrier related to the cost in implementing e-Healthsolutions whether it is feasible in-terms of cost wise ie do the benefit of e-Healthoutweigh the cost required to implement E-health From the technical side theimplementation of E-health solutions is clearly advantageous in comparison with pastmethods such as the paper-based record keeping systems but from the healthcareorganization side these benefits may not outweigh the cost of implementinge-Health solutions The cost of implementing e-Health solutions can be tens ofthousands of dollars and this does not even include the requirement of hiring teamsof IT professionals to support and maintain the software throughout its life cycle(Mearian 2010)[13]

22224444 E-HealthE-HealthE-HealthE-Health inininin EUEUEUEU

Most European governments have set up combined systems of healthcare insurancein which public compulsory health insurance coexists with private companies (whichare optional most of the time) Globally the European population is aging whichtranslates into an increasing demand for healthcare and an increased cost of treatmentOn a global basis many governments in Europe are transferring expenses from publicinsurance to private ones The ongoing economic crisis leads both governments andprivate bodies to be in demand for better cost optimization leading to a globallybetter governance of the healthcare system[14]

The combination of social and policy factors described in the previous section havealready created the basis for a strong European demand for E-Health services and

6

applications Based on an analysis undertaken by Capgemini Consulting in the contextof this project the European E-Health market was about at EUR14269 million in2008 year and it is also projected to reach EUR15619 million by 2012 it grows witha rate of 29 A per-country analysis of the results confirms that France GermanyItaly Spain and the United Kingdom are the principal European E-Health marketsHowever the analysis also confirms that over the next three years all nationalE-Health markets will experience some form of growth in this area [15]

22225555 E-healthE-healthE-healthE-health RequirementRequirementRequirementRequirement

Aiming to the specific field we should take the following main parts into account thatis the designing computing and data format

InteractionInteractionInteractionInteraction designdesigndesigndesign The E-health frame should meet different rolesrsquo requirement andaccess authority management which will be used as a basic model in some specificapplication in the future For example different roles such as diabetes patients doctorsand administrator can be created and the discussion between patients and doctorsshould be available Moreover the authenticated doctor can access the specified itemsof the patients which will solve the problem of security

UIUIUIUI designdesigndesigndesign the E-health website page should be shown concise so that it should becomfortable for the users administrators and developers and the responsive webdesign was used to fulfill the requirement which can be well suited to different typedevices with flexible screen such as the PC mobile phone etc

MobilityMobilityMobilityMobility andandandand powerfulpowerfulpowerfulpowerful computingcomputingcomputingcomputing capabilitiescapabilitiescapabilitiescapabilities The E-health website should bevisited at anyplace with anytime So the real-time interaction should be an importantissue and taken into account Additionally a powerful computing capability should beowned to solve the problem that if too many users access the website

DataDataDataData FormatFormatFormatFormat The data in the system should follow the medical standard format andrules such as the unit of glucose it is mmolL The medical words should be usedseriously

DataDataDataData StorageStorageStorageStorage Considering the security issue of the data storage such as the storageformat and privacy information data protection A proper database with highersecurity level should be choose which will be further discussed in the Chapter 55

DataDataDataData PresentationPresentationPresentationPresentation In order to provide a concise and beautiful view of the dataThedata presentation can combine with different presentation formats such as histogramand table etc according the medical data requirement

7

3333 LiteratureLiteratureLiteratureLiterature RRRRevieweviewevieweview onononon ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb DesigDesigDesigDesignnnn andandandand

RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

31313131 MethodsMethodsMethodsMethods andandandand ResourcesResourcesResourcesResources

A systematic research is taken to generate meaningful result of our purpose Two mainsteps were taken to search and evaluate the results(1) Gathering sources it contains abroad search using the most relevant key words for more potential hits and whatrsquosmore a good literature review requires that you isolate key themes or issues related toyour own research interests so more restriction were added to filter the articles(2)Evaluating sources reading all the final articles with some questions kept inmindDoes the evidence support the conclusion Is the argument or evidencecomplete Does all research arrive at the same conclusion or are there differing Atlast eliminating unuseful articles with these merit and classifying all the remainedarticlesIn the first place Springer database were chosen for this literature review studyrsquos datasource it is widely used in the computer science research study and maintained bySpringer-Verlag which is one of the most famous science and technology publishcompany But in the Springer database the articles which are related to ComputerScience mostly are not related to E-health so the Google Scholar were also chosen todo this research All the key words were divided into four categories ldquoTopicrdquoldquoTechnologyrdquo ldquoProgramming Languagerdquo ldquoDevicerdquo

8

32323232 LiteratureLiteratureLiteratureLiterature SearchSearchSearchSearch

The following flow diagram show the literature review process

Figure 1 Articles Search Process

33333333 AnalysisAnalysisAnalysisAnalysis

331331331331 PublishingPublishingPublishingPublishing yearyearyearyearTable 1 Table for count of each publishing yearrsquos articlePublishingPublishingPublishingPublishing yearyearyearyear CountCountCountCount

2013 22012 62011 62010 6

2000-2010 0

The table above shows the count of reports in each publishing year The attention onresponsive web design rises from year 2010 when Ethan Marcotte put forward theconcept of RWD then it keeps the main trend and become to be popular as thenumber remain stable per year until to now

Springer database Google Scholar databaseKey words are divided into four categories(1) Topic ldquoresponsive web designrdquo(2) Technology ldquomedia-queryrdquo ldquoflexible gridrdquo(3) Programming Language ldquoNETrdquo ldquoHTML5rdquo ldquoCSS3rdquo(4) Device ldquohandheldrdquo ldquosmart-phonerdquoldquolaptoprdquo

179 articles were found (73 articles from Springerdatabase 106 articles were found from Google)

136 articles can find full text

43 articles discardedsince no full text found

71 articles were concerning about computer-basedtechnologies

20 articles were concerning about responsive webdesign

65 articles discardedsince no mention aboutcomputer technologies

51 articles discardedsince no met about

responsive web design

9

332332332332 PublishingPublishingPublishingPublishing countrycountrycountrycountryTable 2 Table for count of each countryrsquos article

PublishingPublishingPublishingPublishing countrycountrycountrycountry CountCountCountCountAustria 1Finland 2Germany 5Greece 1USA 4UK 3

Norway 1Italy 1

Sweden 2

From table above it indicates that Germany Smashing magazine put the mostefforts on responsive web design among all countries 5 related reports arepublished in Germany It can be seen that USA and UK also work hard on responsiveweb design with 4 and 3 research reports respectively The number of reports whichpublished in Europe and UK is 15 Especially Central European countries and Nordiccountries have made a major contribution to improve responsive web development 12published research papers However looking back to Asia no result are found in theresult set

33334444 QualitativeQualitativeQualitativeQualitative findingsfindingsfindingsfindings

With increasing Web users using handheld device to browse Web sites and apps Webdesigners and developers must make sure that their creations look good and workwell on mobile devices just like on traditional desktop computers

341341341341 TheTheTheThe developmentdevelopmentdevelopmentdevelopment ofofofof mobilemobilemobilemobile devicedevicedevicedevice marketmarketmarketmarketNowadays There is a large amount of site traffic comes from mobiledevicesmdashnamely smart phones and tablets(mainly the iPhone and iPad)mdashin additionto traditional personal computers Across the world mobile devices now account formore than 12 percent of Internet traffic in 2012 and this is increasing much fasterthan desktop computer and laptop Internet traffic In nations with high smart-phonepenetration the fraction of mobile Web traffic is sufficiently higher Whatrsquos more thisdata is expected to increase significantly over the next 10 years as smart-phonesdevelop and mature both in hardware and software and adoption which picks up inSouth America Asia and Africa[16]

Google company predicts that mobile devices will drive travel searches up by 15 -25 in 2013[17]

10

NASDAQ SCOR has reported that in the United State 51 of smart-phone ownersare using these handheld devices to access travel information[18]

Responsive Web Design has been cited as the No1 web design and developmenttrend for 2013 by the net magazine[19]

It is a real fact that the Smart-phone sales surpassed PC throughout the decade All ofthese are secondary in comparison to the fact that simple and clearly view in handhelddevice is needed to exist in the market of the future The figure 1 below shows thedevelopment of the mobile market

Figure 2 The Development Of Mobile Market[20]

From figure 1 we can draw the conclusion that mobile traffic is increasing incrediblyfast People check their email on mobile device first more and more people wouldlike to use high end and fast systemdevices(it is clear that the user of iPad and iPhoneoccupied the most proportion)

342342342342 SurveySurveySurveySurvey ofofofof thethethethe E-healthE-healthE-healthE-health useruseruseruserrsquorsquorsquorsquossss requirementrequirementrequirementrequirementPeople are increasingly viewing their connection to the internet including theirgadgets as their lifeline Your patients keep their address book calendar and more ontheir mobile devices They rely on them Ensuring that your website is easilyaccessible and properly optimized for mobile devices just makes sense The trendtowards patients using their mobile devices to access information will only continueto grow In fact some sources claim that by 2015 nearly everyone will access theinternet from a mobile device With such a trend it makes sense to considerresponsive web design for your medical or dental website [21]

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 4: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

IV

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation4545454571 Performance Testing4572 Black Box testing 48

8888 ConclusionConclusionConclusionConclusion505050509999 FutureFutureFutureFutureWorkWorkWorkWork5151515110101010 ReferencesReferencesReferencesReferences 5252525211111111 EnclosuresEnclosuresEnclosuresEnclosures55555555

Enclosure 1 Articles for literature review55Enclosure 2 Report for responsive web load speed simulation56Enclosure 3 Abbreviations 57Enclosure 4 Meeting Investigation59

1

1111 IntroductionIntroductionIntroductionIntroduction

11111111 BackgroundBackgroundBackgroundBackground

With the rapid development of smart phones and mobile devices[1] it becomes verypopular that people more prefer to access the information through this flexible waySo the requirement of proper interface according to different devices become a hottopic and the goal will motivate the use of RWD[2](Responsive Web Design) It aimsat crafting sites to provide an optimal viewing experience in easy reading andnavigation with a minimum of resizing panning and scrolling across a wide range ofdevices such as from desktop computer monitors to mobile phones Whatrsquos more nowdays E-health has gradually aroused great attention all over world And the modernday healthcare needs and delivery is complex and the use of ICT[3] has made somepositive impact in attending to such needs that e-health applications require Theproject is about E-health[4] web application framework and responsive web designwhich base on the cloud platform This idea comes from instructor Dr Eric Chenrsquosproject proposal Though there are some existing researches in above fields there isless or almost none related work which combines these fields to provide a basic framespecifically focusing on the e-health Right information at right time saves lives Soan E-health web application framework and platform based on the cloud is a part ofinformation and communication technology supported self-care system for thediabetes This project will closely collaborate with another group working datacollection and presentation application The new related work in above fields worth tobe done from the view of reality and research

12121212 AimAimAimAim andandandand purposepurposepurposepurpose

The main purpose of the project is to develop an E-health-field system basic framecombined with the responsive web design technology based on the cloud server Itoffers a basic common model which can be used by some special E-health applicationdevelopment in the future It provides a worth guideline on E-health web applicationfor people self-care management And the model is designed to be applied to developa specific application aiming to the diabetes self-care managementThe projectrsquos main work is as following

121121121121 SystematicSystematicSystematicSystematic literatureliteratureliteratureliterature reviewreviewreviewreview andandandand InternetInternetInternetInternet searchsearchsearchsearchWe will do the literature review about the responsive web design in a systematic wayrecord the results and do the analysis on what others have done in the area so that wecan start the work based on the available results

2

122122122122 ToToToTo establishestablishestablishestablish anananan EEEE-health-health-health-health webwebwebweb applicationapplicationapplicationapplication frameframeframeframeThis project mainly focus on establishing a responsive e-health system frame to offera basic common model which can be used by some special e-health application in thefuture On one hand we should select a proper development platform and cloudplatform On the other hand the frame should focus on the security problem such asthe access control and data storage

123123123123 ToToToTo designdesigndesigndesign aaaa reasonablereasonablereasonablereasonable responsiveresponsiveresponsiveresponsive webwebwebweb designdesigndesigndesign methodmethodmethodmethodThe E-health frame will be developed by combining several technology (NETHTML5 JavaScript CSS ) Among these technologies CSS is responsible for theweb visual style on the device So we should improve and design a reasonable styletransformation method through learning the existing related CSS method And we tryto ensure the style can be transformed automatically and well compatibly applied intodifferent devices Then we will design a guideline about the it since the system willbe extended in the future

124124124124 ToToToTo SelectSelectSelectSelect thethethethe reasonablereasonablereasonablereasonable deploymentdeploymentdeploymentdeployment vendorvendorvendorvendor forforforfor EEEE----hhhhealthealthealthealthMany of the associates identified that selection of good vendor is the critical step forthe Health care before adopting cloud computing Selection of vendor needs properplanning and analysis and hospital must have to check the vendor backgroundservices they provided from how long they are providing the services and customersatisfaction about the vendor Good vendor will produce secure SLA[5]rsquos to thecustomer and it will produce good relationship between the customer and the vendorIf health sector selected good vendor vendor can produce secure SLArsquos to secure andshare the data between the hospitals So in this part many interviews and survey willbe done to help us to select a reasonable deployment model for E-Health

Due to the limitation of the project time the demo application is designed to bedeveloped as a web-app So the responsive web design part has been tried to fit withthe smart embedded devices to a large extent Some optimizations and the scopeextent of the application should be further improved to fix with the different deviceswell Moreover more functions will be added to the diabetes application according touserrsquos requirements the in the future

13131313 ReportReportReportReport organizationorganizationorganizationorganization

The report is divided into 11 chapters The first chapter introduces the background ofthe research and main purpose And next Chapter 2 introduces the development stateof the E-health and its advantage and disadvantage in detail Then in the Chapter 3 asystematic Literature review about the responsive web design will be done and theresult will be further analyzed to conclude a method to meet with the requirement ofthe framework In Chapter 4 the security problem will be discussed A flexible usermanagement and access permission control will be introduced in detail to providedesired privacy and security And in Chapter 5 a systematic comparison between

3

existing cloud platform and database will be done to select a most suitable vendorThen the core part of the project will be introduced in Chapter6 This part introducethe whole project development process in detail and some encountered problems andsolutions From Chapter 7 to 10 the applicationrsquos system test evaluation conclusionsome future works and quoted reference will be included Lastly in Charter 11 somecore codes and other common infrastructure will be attached

14141414 AcknowledgementAcknowledgementAcknowledgementAcknowledgement

The special thanks will be expressed to the instructor Dr Eric Chen weekly meetingand patient conduct guide us to get a obvious understanding of the project work and abetter application design He also arranged some meetings with Kerstin Blomqvistthe expert in diabetes field which help us to gain much professional advice and guideIn addition he helps us to organize and modify the reports with great patience Thenwe will express great thanks to the Dr Kerstin and her doctoral student for selflessprofessional guidance and helps Moreover thanks for the help and cooperation fromanother data collecting and presenting group QunYing Song and JingJing Xu Lastlywe will express our thanks to the examiner DrDawit Mengistu for his advice andevaluation The whole project can be realized successfully due to their inseparableefforts to a large extent

4

2222 StudyStudyStudyStudy onononon E-healthE-healthE-healthE-health

21212121 IntroductionIntroductionIntroductionIntroduction

There are many definitions for E-Health until now but still there is no consensus onone common definition This is because of its ubiquitous and dynamic nature TheE-health information are widely used with different meanings and purposes In ourwork we develop the E-health application mostly used for diabetes patient

Joaquin (2010) who is one of the World health organization members definedE-health as the use of information and communications technologies (ICT) in favor ofhealth and health-related fields containing health-care services health supervisionhealth literature and health self-management education knowledge and research andstated that E-health has the potential to greatly improve health service efficiency itshould expand or extend treatment delivery to more than thousands of patients indeveloping countries and also improve patient results[6] In another word Mitchell defined that ldquo the combined use of electroniccommunication and information technology in the health field need to be described bya new term The use in the health sector of digital data transmitted stored andretrieved electronically both at the local site and at a distance for clinical educationaland administrative purposes rdquo(Mitchell 1999) [7]Sweden America Britain and the rest of Europe has experienced a great proliferationof health care-related websites most of which present disinformation and misleadingguidance(Fogg et al 2001)[8] And research suggests that the E-health web usersexpress the strong desire to own a online website which is used for theirself-management and directly getting advice from the doctor So the self-managementand interoperability are mostly focused in our project

22222222 AdvantagesAdvantagesAdvantagesAdvantages ofofofof E-healthE-healthE-healthE-health

There are many advantages in using E-Health concepts One key example isElectronic Health Records Before E-health came into use we used paper basedsystem to record patient health data These paper based system may have errorswhile entering the patient records into papers Coming to E-health data storeelectronically and it is more simpler and efficient way of data storing (Haumlyrinen2008)[9] Grogan stated that there is an evidence to suggest that E-health providemore complete and error free methods for storing patient data (Grogan 2006)[10]

By using E-health there are many benefits to different people such as doctorspatients etc For example doctorrsquos orders can be placed electronically which avoidwrong elucidation of hand wrote orders And with the help of E-health most doctorsreduces the time of locating and reading patient health information To the patient

5

they can begin to be gradually aware of the importance of self-care managementMoreover it is also convenient for maintaining only with some experts in medical andapplication developers

23232323 BarriersBarriersBarriersBarriers totototo E-HealthE-HealthE-HealthE-Health

The followings list are the main barriers to E-health

231231231231 OperationalOperationalOperationalOperational BarriersBarriersBarriersBarriersThis area of concern relates to the interoperability of systems which e-Health aims toprovide (John 2009)[11] First a system has to be developed with an interfaceallowing existing computer system to communicate with new system which e-Healthwill introduce Second there must be a common standard electronic language to crosscommunicate between different healthcare organization about the medical data suchas patient records and hospital internal record There must be formal agreement onwhat the best method to communicate such data between organizations (Hill et al2007)[12]

232232232232 CostBenefitCostBenefitCostBenefitCostBenefit BarriersBarriersBarriersBarriersAs the name suggest it is the barrier related to the cost in implementing e-Healthsolutions whether it is feasible in-terms of cost wise ie do the benefit of e-Healthoutweigh the cost required to implement E-health From the technical side theimplementation of E-health solutions is clearly advantageous in comparison with pastmethods such as the paper-based record keeping systems but from the healthcareorganization side these benefits may not outweigh the cost of implementinge-Health solutions The cost of implementing e-Health solutions can be tens ofthousands of dollars and this does not even include the requirement of hiring teamsof IT professionals to support and maintain the software throughout its life cycle(Mearian 2010)[13]

22224444 E-HealthE-HealthE-HealthE-Health inininin EUEUEUEU

Most European governments have set up combined systems of healthcare insurancein which public compulsory health insurance coexists with private companies (whichare optional most of the time) Globally the European population is aging whichtranslates into an increasing demand for healthcare and an increased cost of treatmentOn a global basis many governments in Europe are transferring expenses from publicinsurance to private ones The ongoing economic crisis leads both governments andprivate bodies to be in demand for better cost optimization leading to a globallybetter governance of the healthcare system[14]

The combination of social and policy factors described in the previous section havealready created the basis for a strong European demand for E-Health services and

6

applications Based on an analysis undertaken by Capgemini Consulting in the contextof this project the European E-Health market was about at EUR14269 million in2008 year and it is also projected to reach EUR15619 million by 2012 it grows witha rate of 29 A per-country analysis of the results confirms that France GermanyItaly Spain and the United Kingdom are the principal European E-Health marketsHowever the analysis also confirms that over the next three years all nationalE-Health markets will experience some form of growth in this area [15]

22225555 E-healthE-healthE-healthE-health RequirementRequirementRequirementRequirement

Aiming to the specific field we should take the following main parts into account thatis the designing computing and data format

InteractionInteractionInteractionInteraction designdesigndesigndesign The E-health frame should meet different rolesrsquo requirement andaccess authority management which will be used as a basic model in some specificapplication in the future For example different roles such as diabetes patients doctorsand administrator can be created and the discussion between patients and doctorsshould be available Moreover the authenticated doctor can access the specified itemsof the patients which will solve the problem of security

UIUIUIUI designdesigndesigndesign the E-health website page should be shown concise so that it should becomfortable for the users administrators and developers and the responsive webdesign was used to fulfill the requirement which can be well suited to different typedevices with flexible screen such as the PC mobile phone etc

MobilityMobilityMobilityMobility andandandand powerfulpowerfulpowerfulpowerful computingcomputingcomputingcomputing capabilitiescapabilitiescapabilitiescapabilities The E-health website should bevisited at anyplace with anytime So the real-time interaction should be an importantissue and taken into account Additionally a powerful computing capability should beowned to solve the problem that if too many users access the website

DataDataDataData FormatFormatFormatFormat The data in the system should follow the medical standard format andrules such as the unit of glucose it is mmolL The medical words should be usedseriously

DataDataDataData StorageStorageStorageStorage Considering the security issue of the data storage such as the storageformat and privacy information data protection A proper database with highersecurity level should be choose which will be further discussed in the Chapter 55

DataDataDataData PresentationPresentationPresentationPresentation In order to provide a concise and beautiful view of the dataThedata presentation can combine with different presentation formats such as histogramand table etc according the medical data requirement

7

3333 LiteratureLiteratureLiteratureLiterature RRRRevieweviewevieweview onononon ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb DesigDesigDesigDesignnnn andandandand

RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

31313131 MethodsMethodsMethodsMethods andandandand ResourcesResourcesResourcesResources

A systematic research is taken to generate meaningful result of our purpose Two mainsteps were taken to search and evaluate the results(1) Gathering sources it contains abroad search using the most relevant key words for more potential hits and whatrsquosmore a good literature review requires that you isolate key themes or issues related toyour own research interests so more restriction were added to filter the articles(2)Evaluating sources reading all the final articles with some questions kept inmindDoes the evidence support the conclusion Is the argument or evidencecomplete Does all research arrive at the same conclusion or are there differing Atlast eliminating unuseful articles with these merit and classifying all the remainedarticlesIn the first place Springer database were chosen for this literature review studyrsquos datasource it is widely used in the computer science research study and maintained bySpringer-Verlag which is one of the most famous science and technology publishcompany But in the Springer database the articles which are related to ComputerScience mostly are not related to E-health so the Google Scholar were also chosen todo this research All the key words were divided into four categories ldquoTopicrdquoldquoTechnologyrdquo ldquoProgramming Languagerdquo ldquoDevicerdquo

8

32323232 LiteratureLiteratureLiteratureLiterature SearchSearchSearchSearch

The following flow diagram show the literature review process

Figure 1 Articles Search Process

33333333 AnalysisAnalysisAnalysisAnalysis

331331331331 PublishingPublishingPublishingPublishing yearyearyearyearTable 1 Table for count of each publishing yearrsquos articlePublishingPublishingPublishingPublishing yearyearyearyear CountCountCountCount

2013 22012 62011 62010 6

2000-2010 0

The table above shows the count of reports in each publishing year The attention onresponsive web design rises from year 2010 when Ethan Marcotte put forward theconcept of RWD then it keeps the main trend and become to be popular as thenumber remain stable per year until to now

Springer database Google Scholar databaseKey words are divided into four categories(1) Topic ldquoresponsive web designrdquo(2) Technology ldquomedia-queryrdquo ldquoflexible gridrdquo(3) Programming Language ldquoNETrdquo ldquoHTML5rdquo ldquoCSS3rdquo(4) Device ldquohandheldrdquo ldquosmart-phonerdquoldquolaptoprdquo

179 articles were found (73 articles from Springerdatabase 106 articles were found from Google)

136 articles can find full text

43 articles discardedsince no full text found

71 articles were concerning about computer-basedtechnologies

20 articles were concerning about responsive webdesign

65 articles discardedsince no mention aboutcomputer technologies

51 articles discardedsince no met about

responsive web design

9

332332332332 PublishingPublishingPublishingPublishing countrycountrycountrycountryTable 2 Table for count of each countryrsquos article

PublishingPublishingPublishingPublishing countrycountrycountrycountry CountCountCountCountAustria 1Finland 2Germany 5Greece 1USA 4UK 3

Norway 1Italy 1

Sweden 2

From table above it indicates that Germany Smashing magazine put the mostefforts on responsive web design among all countries 5 related reports arepublished in Germany It can be seen that USA and UK also work hard on responsiveweb design with 4 and 3 research reports respectively The number of reports whichpublished in Europe and UK is 15 Especially Central European countries and Nordiccountries have made a major contribution to improve responsive web development 12published research papers However looking back to Asia no result are found in theresult set

33334444 QualitativeQualitativeQualitativeQualitative findingsfindingsfindingsfindings

With increasing Web users using handheld device to browse Web sites and apps Webdesigners and developers must make sure that their creations look good and workwell on mobile devices just like on traditional desktop computers

341341341341 TheTheTheThe developmentdevelopmentdevelopmentdevelopment ofofofof mobilemobilemobilemobile devicedevicedevicedevice marketmarketmarketmarketNowadays There is a large amount of site traffic comes from mobiledevicesmdashnamely smart phones and tablets(mainly the iPhone and iPad)mdashin additionto traditional personal computers Across the world mobile devices now account formore than 12 percent of Internet traffic in 2012 and this is increasing much fasterthan desktop computer and laptop Internet traffic In nations with high smart-phonepenetration the fraction of mobile Web traffic is sufficiently higher Whatrsquos more thisdata is expected to increase significantly over the next 10 years as smart-phonesdevelop and mature both in hardware and software and adoption which picks up inSouth America Asia and Africa[16]

Google company predicts that mobile devices will drive travel searches up by 15 -25 in 2013[17]

10

NASDAQ SCOR has reported that in the United State 51 of smart-phone ownersare using these handheld devices to access travel information[18]

Responsive Web Design has been cited as the No1 web design and developmenttrend for 2013 by the net magazine[19]

It is a real fact that the Smart-phone sales surpassed PC throughout the decade All ofthese are secondary in comparison to the fact that simple and clearly view in handhelddevice is needed to exist in the market of the future The figure 1 below shows thedevelopment of the mobile market

Figure 2 The Development Of Mobile Market[20]

From figure 1 we can draw the conclusion that mobile traffic is increasing incrediblyfast People check their email on mobile device first more and more people wouldlike to use high end and fast systemdevices(it is clear that the user of iPad and iPhoneoccupied the most proportion)

342342342342 SurveySurveySurveySurvey ofofofof thethethethe E-healthE-healthE-healthE-health useruseruseruserrsquorsquorsquorsquossss requirementrequirementrequirementrequirementPeople are increasingly viewing their connection to the internet including theirgadgets as their lifeline Your patients keep their address book calendar and more ontheir mobile devices They rely on them Ensuring that your website is easilyaccessible and properly optimized for mobile devices just makes sense The trendtowards patients using their mobile devices to access information will only continueto grow In fact some sources claim that by 2015 nearly everyone will access theinternet from a mobile device With such a trend it makes sense to considerresponsive web design for your medical or dental website [21]

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 5: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

1

1111 IntroductionIntroductionIntroductionIntroduction

11111111 BackgroundBackgroundBackgroundBackground

With the rapid development of smart phones and mobile devices[1] it becomes verypopular that people more prefer to access the information through this flexible waySo the requirement of proper interface according to different devices become a hottopic and the goal will motivate the use of RWD[2](Responsive Web Design) It aimsat crafting sites to provide an optimal viewing experience in easy reading andnavigation with a minimum of resizing panning and scrolling across a wide range ofdevices such as from desktop computer monitors to mobile phones Whatrsquos more nowdays E-health has gradually aroused great attention all over world And the modernday healthcare needs and delivery is complex and the use of ICT[3] has made somepositive impact in attending to such needs that e-health applications require Theproject is about E-health[4] web application framework and responsive web designwhich base on the cloud platform This idea comes from instructor Dr Eric Chenrsquosproject proposal Though there are some existing researches in above fields there isless or almost none related work which combines these fields to provide a basic framespecifically focusing on the e-health Right information at right time saves lives Soan E-health web application framework and platform based on the cloud is a part ofinformation and communication technology supported self-care system for thediabetes This project will closely collaborate with another group working datacollection and presentation application The new related work in above fields worth tobe done from the view of reality and research

12121212 AimAimAimAim andandandand purposepurposepurposepurpose

The main purpose of the project is to develop an E-health-field system basic framecombined with the responsive web design technology based on the cloud server Itoffers a basic common model which can be used by some special E-health applicationdevelopment in the future It provides a worth guideline on E-health web applicationfor people self-care management And the model is designed to be applied to developa specific application aiming to the diabetes self-care managementThe projectrsquos main work is as following

121121121121 SystematicSystematicSystematicSystematic literatureliteratureliteratureliterature reviewreviewreviewreview andandandand InternetInternetInternetInternet searchsearchsearchsearchWe will do the literature review about the responsive web design in a systematic wayrecord the results and do the analysis on what others have done in the area so that wecan start the work based on the available results

2

122122122122 ToToToTo establishestablishestablishestablish anananan EEEE-health-health-health-health webwebwebweb applicationapplicationapplicationapplication frameframeframeframeThis project mainly focus on establishing a responsive e-health system frame to offera basic common model which can be used by some special e-health application in thefuture On one hand we should select a proper development platform and cloudplatform On the other hand the frame should focus on the security problem such asthe access control and data storage

123123123123 ToToToTo designdesigndesigndesign aaaa reasonablereasonablereasonablereasonable responsiveresponsiveresponsiveresponsive webwebwebweb designdesigndesigndesign methodmethodmethodmethodThe E-health frame will be developed by combining several technology (NETHTML5 JavaScript CSS ) Among these technologies CSS is responsible for theweb visual style on the device So we should improve and design a reasonable styletransformation method through learning the existing related CSS method And we tryto ensure the style can be transformed automatically and well compatibly applied intodifferent devices Then we will design a guideline about the it since the system willbe extended in the future

124124124124 ToToToTo SelectSelectSelectSelect thethethethe reasonablereasonablereasonablereasonable deploymentdeploymentdeploymentdeployment vendorvendorvendorvendor forforforfor EEEE----hhhhealthealthealthealthMany of the associates identified that selection of good vendor is the critical step forthe Health care before adopting cloud computing Selection of vendor needs properplanning and analysis and hospital must have to check the vendor backgroundservices they provided from how long they are providing the services and customersatisfaction about the vendor Good vendor will produce secure SLA[5]rsquos to thecustomer and it will produce good relationship between the customer and the vendorIf health sector selected good vendor vendor can produce secure SLArsquos to secure andshare the data between the hospitals So in this part many interviews and survey willbe done to help us to select a reasonable deployment model for E-Health

Due to the limitation of the project time the demo application is designed to bedeveloped as a web-app So the responsive web design part has been tried to fit withthe smart embedded devices to a large extent Some optimizations and the scopeextent of the application should be further improved to fix with the different deviceswell Moreover more functions will be added to the diabetes application according touserrsquos requirements the in the future

13131313 ReportReportReportReport organizationorganizationorganizationorganization

The report is divided into 11 chapters The first chapter introduces the background ofthe research and main purpose And next Chapter 2 introduces the development stateof the E-health and its advantage and disadvantage in detail Then in the Chapter 3 asystematic Literature review about the responsive web design will be done and theresult will be further analyzed to conclude a method to meet with the requirement ofthe framework In Chapter 4 the security problem will be discussed A flexible usermanagement and access permission control will be introduced in detail to providedesired privacy and security And in Chapter 5 a systematic comparison between

3

existing cloud platform and database will be done to select a most suitable vendorThen the core part of the project will be introduced in Chapter6 This part introducethe whole project development process in detail and some encountered problems andsolutions From Chapter 7 to 10 the applicationrsquos system test evaluation conclusionsome future works and quoted reference will be included Lastly in Charter 11 somecore codes and other common infrastructure will be attached

14141414 AcknowledgementAcknowledgementAcknowledgementAcknowledgement

The special thanks will be expressed to the instructor Dr Eric Chen weekly meetingand patient conduct guide us to get a obvious understanding of the project work and abetter application design He also arranged some meetings with Kerstin Blomqvistthe expert in diabetes field which help us to gain much professional advice and guideIn addition he helps us to organize and modify the reports with great patience Thenwe will express great thanks to the Dr Kerstin and her doctoral student for selflessprofessional guidance and helps Moreover thanks for the help and cooperation fromanother data collecting and presenting group QunYing Song and JingJing Xu Lastlywe will express our thanks to the examiner DrDawit Mengistu for his advice andevaluation The whole project can be realized successfully due to their inseparableefforts to a large extent

4

2222 StudyStudyStudyStudy onononon E-healthE-healthE-healthE-health

21212121 IntroductionIntroductionIntroductionIntroduction

There are many definitions for E-Health until now but still there is no consensus onone common definition This is because of its ubiquitous and dynamic nature TheE-health information are widely used with different meanings and purposes In ourwork we develop the E-health application mostly used for diabetes patient

Joaquin (2010) who is one of the World health organization members definedE-health as the use of information and communications technologies (ICT) in favor ofhealth and health-related fields containing health-care services health supervisionhealth literature and health self-management education knowledge and research andstated that E-health has the potential to greatly improve health service efficiency itshould expand or extend treatment delivery to more than thousands of patients indeveloping countries and also improve patient results[6] In another word Mitchell defined that ldquo the combined use of electroniccommunication and information technology in the health field need to be described bya new term The use in the health sector of digital data transmitted stored andretrieved electronically both at the local site and at a distance for clinical educationaland administrative purposes rdquo(Mitchell 1999) [7]Sweden America Britain and the rest of Europe has experienced a great proliferationof health care-related websites most of which present disinformation and misleadingguidance(Fogg et al 2001)[8] And research suggests that the E-health web usersexpress the strong desire to own a online website which is used for theirself-management and directly getting advice from the doctor So the self-managementand interoperability are mostly focused in our project

22222222 AdvantagesAdvantagesAdvantagesAdvantages ofofofof E-healthE-healthE-healthE-health

There are many advantages in using E-Health concepts One key example isElectronic Health Records Before E-health came into use we used paper basedsystem to record patient health data These paper based system may have errorswhile entering the patient records into papers Coming to E-health data storeelectronically and it is more simpler and efficient way of data storing (Haumlyrinen2008)[9] Grogan stated that there is an evidence to suggest that E-health providemore complete and error free methods for storing patient data (Grogan 2006)[10]

By using E-health there are many benefits to different people such as doctorspatients etc For example doctorrsquos orders can be placed electronically which avoidwrong elucidation of hand wrote orders And with the help of E-health most doctorsreduces the time of locating and reading patient health information To the patient

5

they can begin to be gradually aware of the importance of self-care managementMoreover it is also convenient for maintaining only with some experts in medical andapplication developers

23232323 BarriersBarriersBarriersBarriers totototo E-HealthE-HealthE-HealthE-Health

The followings list are the main barriers to E-health

231231231231 OperationalOperationalOperationalOperational BarriersBarriersBarriersBarriersThis area of concern relates to the interoperability of systems which e-Health aims toprovide (John 2009)[11] First a system has to be developed with an interfaceallowing existing computer system to communicate with new system which e-Healthwill introduce Second there must be a common standard electronic language to crosscommunicate between different healthcare organization about the medical data suchas patient records and hospital internal record There must be formal agreement onwhat the best method to communicate such data between organizations (Hill et al2007)[12]

232232232232 CostBenefitCostBenefitCostBenefitCostBenefit BarriersBarriersBarriersBarriersAs the name suggest it is the barrier related to the cost in implementing e-Healthsolutions whether it is feasible in-terms of cost wise ie do the benefit of e-Healthoutweigh the cost required to implement E-health From the technical side theimplementation of E-health solutions is clearly advantageous in comparison with pastmethods such as the paper-based record keeping systems but from the healthcareorganization side these benefits may not outweigh the cost of implementinge-Health solutions The cost of implementing e-Health solutions can be tens ofthousands of dollars and this does not even include the requirement of hiring teamsof IT professionals to support and maintain the software throughout its life cycle(Mearian 2010)[13]

22224444 E-HealthE-HealthE-HealthE-Health inininin EUEUEUEU

Most European governments have set up combined systems of healthcare insurancein which public compulsory health insurance coexists with private companies (whichare optional most of the time) Globally the European population is aging whichtranslates into an increasing demand for healthcare and an increased cost of treatmentOn a global basis many governments in Europe are transferring expenses from publicinsurance to private ones The ongoing economic crisis leads both governments andprivate bodies to be in demand for better cost optimization leading to a globallybetter governance of the healthcare system[14]

The combination of social and policy factors described in the previous section havealready created the basis for a strong European demand for E-Health services and

6

applications Based on an analysis undertaken by Capgemini Consulting in the contextof this project the European E-Health market was about at EUR14269 million in2008 year and it is also projected to reach EUR15619 million by 2012 it grows witha rate of 29 A per-country analysis of the results confirms that France GermanyItaly Spain and the United Kingdom are the principal European E-Health marketsHowever the analysis also confirms that over the next three years all nationalE-Health markets will experience some form of growth in this area [15]

22225555 E-healthE-healthE-healthE-health RequirementRequirementRequirementRequirement

Aiming to the specific field we should take the following main parts into account thatis the designing computing and data format

InteractionInteractionInteractionInteraction designdesigndesigndesign The E-health frame should meet different rolesrsquo requirement andaccess authority management which will be used as a basic model in some specificapplication in the future For example different roles such as diabetes patients doctorsand administrator can be created and the discussion between patients and doctorsshould be available Moreover the authenticated doctor can access the specified itemsof the patients which will solve the problem of security

UIUIUIUI designdesigndesigndesign the E-health website page should be shown concise so that it should becomfortable for the users administrators and developers and the responsive webdesign was used to fulfill the requirement which can be well suited to different typedevices with flexible screen such as the PC mobile phone etc

MobilityMobilityMobilityMobility andandandand powerfulpowerfulpowerfulpowerful computingcomputingcomputingcomputing capabilitiescapabilitiescapabilitiescapabilities The E-health website should bevisited at anyplace with anytime So the real-time interaction should be an importantissue and taken into account Additionally a powerful computing capability should beowned to solve the problem that if too many users access the website

DataDataDataData FormatFormatFormatFormat The data in the system should follow the medical standard format andrules such as the unit of glucose it is mmolL The medical words should be usedseriously

DataDataDataData StorageStorageStorageStorage Considering the security issue of the data storage such as the storageformat and privacy information data protection A proper database with highersecurity level should be choose which will be further discussed in the Chapter 55

DataDataDataData PresentationPresentationPresentationPresentation In order to provide a concise and beautiful view of the dataThedata presentation can combine with different presentation formats such as histogramand table etc according the medical data requirement

7

3333 LiteratureLiteratureLiteratureLiterature RRRRevieweviewevieweview onononon ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb DesigDesigDesigDesignnnn andandandand

RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

31313131 MethodsMethodsMethodsMethods andandandand ResourcesResourcesResourcesResources

A systematic research is taken to generate meaningful result of our purpose Two mainsteps were taken to search and evaluate the results(1) Gathering sources it contains abroad search using the most relevant key words for more potential hits and whatrsquosmore a good literature review requires that you isolate key themes or issues related toyour own research interests so more restriction were added to filter the articles(2)Evaluating sources reading all the final articles with some questions kept inmindDoes the evidence support the conclusion Is the argument or evidencecomplete Does all research arrive at the same conclusion or are there differing Atlast eliminating unuseful articles with these merit and classifying all the remainedarticlesIn the first place Springer database were chosen for this literature review studyrsquos datasource it is widely used in the computer science research study and maintained bySpringer-Verlag which is one of the most famous science and technology publishcompany But in the Springer database the articles which are related to ComputerScience mostly are not related to E-health so the Google Scholar were also chosen todo this research All the key words were divided into four categories ldquoTopicrdquoldquoTechnologyrdquo ldquoProgramming Languagerdquo ldquoDevicerdquo

8

32323232 LiteratureLiteratureLiteratureLiterature SearchSearchSearchSearch

The following flow diagram show the literature review process

Figure 1 Articles Search Process

33333333 AnalysisAnalysisAnalysisAnalysis

331331331331 PublishingPublishingPublishingPublishing yearyearyearyearTable 1 Table for count of each publishing yearrsquos articlePublishingPublishingPublishingPublishing yearyearyearyear CountCountCountCount

2013 22012 62011 62010 6

2000-2010 0

The table above shows the count of reports in each publishing year The attention onresponsive web design rises from year 2010 when Ethan Marcotte put forward theconcept of RWD then it keeps the main trend and become to be popular as thenumber remain stable per year until to now

Springer database Google Scholar databaseKey words are divided into four categories(1) Topic ldquoresponsive web designrdquo(2) Technology ldquomedia-queryrdquo ldquoflexible gridrdquo(3) Programming Language ldquoNETrdquo ldquoHTML5rdquo ldquoCSS3rdquo(4) Device ldquohandheldrdquo ldquosmart-phonerdquoldquolaptoprdquo

179 articles were found (73 articles from Springerdatabase 106 articles were found from Google)

136 articles can find full text

43 articles discardedsince no full text found

71 articles were concerning about computer-basedtechnologies

20 articles were concerning about responsive webdesign

65 articles discardedsince no mention aboutcomputer technologies

51 articles discardedsince no met about

responsive web design

9

332332332332 PublishingPublishingPublishingPublishing countrycountrycountrycountryTable 2 Table for count of each countryrsquos article

PublishingPublishingPublishingPublishing countrycountrycountrycountry CountCountCountCountAustria 1Finland 2Germany 5Greece 1USA 4UK 3

Norway 1Italy 1

Sweden 2

From table above it indicates that Germany Smashing magazine put the mostefforts on responsive web design among all countries 5 related reports arepublished in Germany It can be seen that USA and UK also work hard on responsiveweb design with 4 and 3 research reports respectively The number of reports whichpublished in Europe and UK is 15 Especially Central European countries and Nordiccountries have made a major contribution to improve responsive web development 12published research papers However looking back to Asia no result are found in theresult set

33334444 QualitativeQualitativeQualitativeQualitative findingsfindingsfindingsfindings

With increasing Web users using handheld device to browse Web sites and apps Webdesigners and developers must make sure that their creations look good and workwell on mobile devices just like on traditional desktop computers

341341341341 TheTheTheThe developmentdevelopmentdevelopmentdevelopment ofofofof mobilemobilemobilemobile devicedevicedevicedevice marketmarketmarketmarketNowadays There is a large amount of site traffic comes from mobiledevicesmdashnamely smart phones and tablets(mainly the iPhone and iPad)mdashin additionto traditional personal computers Across the world mobile devices now account formore than 12 percent of Internet traffic in 2012 and this is increasing much fasterthan desktop computer and laptop Internet traffic In nations with high smart-phonepenetration the fraction of mobile Web traffic is sufficiently higher Whatrsquos more thisdata is expected to increase significantly over the next 10 years as smart-phonesdevelop and mature both in hardware and software and adoption which picks up inSouth America Asia and Africa[16]

Google company predicts that mobile devices will drive travel searches up by 15 -25 in 2013[17]

10

NASDAQ SCOR has reported that in the United State 51 of smart-phone ownersare using these handheld devices to access travel information[18]

Responsive Web Design has been cited as the No1 web design and developmenttrend for 2013 by the net magazine[19]

It is a real fact that the Smart-phone sales surpassed PC throughout the decade All ofthese are secondary in comparison to the fact that simple and clearly view in handhelddevice is needed to exist in the market of the future The figure 1 below shows thedevelopment of the mobile market

Figure 2 The Development Of Mobile Market[20]

From figure 1 we can draw the conclusion that mobile traffic is increasing incrediblyfast People check their email on mobile device first more and more people wouldlike to use high end and fast systemdevices(it is clear that the user of iPad and iPhoneoccupied the most proportion)

342342342342 SurveySurveySurveySurvey ofofofof thethethethe E-healthE-healthE-healthE-health useruseruseruserrsquorsquorsquorsquossss requirementrequirementrequirementrequirementPeople are increasingly viewing their connection to the internet including theirgadgets as their lifeline Your patients keep their address book calendar and more ontheir mobile devices They rely on them Ensuring that your website is easilyaccessible and properly optimized for mobile devices just makes sense The trendtowards patients using their mobile devices to access information will only continueto grow In fact some sources claim that by 2015 nearly everyone will access theinternet from a mobile device With such a trend it makes sense to considerresponsive web design for your medical or dental website [21]

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 6: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

2

122122122122 ToToToTo establishestablishestablishestablish anananan EEEE-health-health-health-health webwebwebweb applicationapplicationapplicationapplication frameframeframeframeThis project mainly focus on establishing a responsive e-health system frame to offera basic common model which can be used by some special e-health application in thefuture On one hand we should select a proper development platform and cloudplatform On the other hand the frame should focus on the security problem such asthe access control and data storage

123123123123 ToToToTo designdesigndesigndesign aaaa reasonablereasonablereasonablereasonable responsiveresponsiveresponsiveresponsive webwebwebweb designdesigndesigndesign methodmethodmethodmethodThe E-health frame will be developed by combining several technology (NETHTML5 JavaScript CSS ) Among these technologies CSS is responsible for theweb visual style on the device So we should improve and design a reasonable styletransformation method through learning the existing related CSS method And we tryto ensure the style can be transformed automatically and well compatibly applied intodifferent devices Then we will design a guideline about the it since the system willbe extended in the future

124124124124 ToToToTo SelectSelectSelectSelect thethethethe reasonablereasonablereasonablereasonable deploymentdeploymentdeploymentdeployment vendorvendorvendorvendor forforforfor EEEE----hhhhealthealthealthealthMany of the associates identified that selection of good vendor is the critical step forthe Health care before adopting cloud computing Selection of vendor needs properplanning and analysis and hospital must have to check the vendor backgroundservices they provided from how long they are providing the services and customersatisfaction about the vendor Good vendor will produce secure SLA[5]rsquos to thecustomer and it will produce good relationship between the customer and the vendorIf health sector selected good vendor vendor can produce secure SLArsquos to secure andshare the data between the hospitals So in this part many interviews and survey willbe done to help us to select a reasonable deployment model for E-Health

Due to the limitation of the project time the demo application is designed to bedeveloped as a web-app So the responsive web design part has been tried to fit withthe smart embedded devices to a large extent Some optimizations and the scopeextent of the application should be further improved to fix with the different deviceswell Moreover more functions will be added to the diabetes application according touserrsquos requirements the in the future

13131313 ReportReportReportReport organizationorganizationorganizationorganization

The report is divided into 11 chapters The first chapter introduces the background ofthe research and main purpose And next Chapter 2 introduces the development stateof the E-health and its advantage and disadvantage in detail Then in the Chapter 3 asystematic Literature review about the responsive web design will be done and theresult will be further analyzed to conclude a method to meet with the requirement ofthe framework In Chapter 4 the security problem will be discussed A flexible usermanagement and access permission control will be introduced in detail to providedesired privacy and security And in Chapter 5 a systematic comparison between

3

existing cloud platform and database will be done to select a most suitable vendorThen the core part of the project will be introduced in Chapter6 This part introducethe whole project development process in detail and some encountered problems andsolutions From Chapter 7 to 10 the applicationrsquos system test evaluation conclusionsome future works and quoted reference will be included Lastly in Charter 11 somecore codes and other common infrastructure will be attached

14141414 AcknowledgementAcknowledgementAcknowledgementAcknowledgement

The special thanks will be expressed to the instructor Dr Eric Chen weekly meetingand patient conduct guide us to get a obvious understanding of the project work and abetter application design He also arranged some meetings with Kerstin Blomqvistthe expert in diabetes field which help us to gain much professional advice and guideIn addition he helps us to organize and modify the reports with great patience Thenwe will express great thanks to the Dr Kerstin and her doctoral student for selflessprofessional guidance and helps Moreover thanks for the help and cooperation fromanother data collecting and presenting group QunYing Song and JingJing Xu Lastlywe will express our thanks to the examiner DrDawit Mengistu for his advice andevaluation The whole project can be realized successfully due to their inseparableefforts to a large extent

4

2222 StudyStudyStudyStudy onononon E-healthE-healthE-healthE-health

21212121 IntroductionIntroductionIntroductionIntroduction

There are many definitions for E-Health until now but still there is no consensus onone common definition This is because of its ubiquitous and dynamic nature TheE-health information are widely used with different meanings and purposes In ourwork we develop the E-health application mostly used for diabetes patient

Joaquin (2010) who is one of the World health organization members definedE-health as the use of information and communications technologies (ICT) in favor ofhealth and health-related fields containing health-care services health supervisionhealth literature and health self-management education knowledge and research andstated that E-health has the potential to greatly improve health service efficiency itshould expand or extend treatment delivery to more than thousands of patients indeveloping countries and also improve patient results[6] In another word Mitchell defined that ldquo the combined use of electroniccommunication and information technology in the health field need to be described bya new term The use in the health sector of digital data transmitted stored andretrieved electronically both at the local site and at a distance for clinical educationaland administrative purposes rdquo(Mitchell 1999) [7]Sweden America Britain and the rest of Europe has experienced a great proliferationof health care-related websites most of which present disinformation and misleadingguidance(Fogg et al 2001)[8] And research suggests that the E-health web usersexpress the strong desire to own a online website which is used for theirself-management and directly getting advice from the doctor So the self-managementand interoperability are mostly focused in our project

22222222 AdvantagesAdvantagesAdvantagesAdvantages ofofofof E-healthE-healthE-healthE-health

There are many advantages in using E-Health concepts One key example isElectronic Health Records Before E-health came into use we used paper basedsystem to record patient health data These paper based system may have errorswhile entering the patient records into papers Coming to E-health data storeelectronically and it is more simpler and efficient way of data storing (Haumlyrinen2008)[9] Grogan stated that there is an evidence to suggest that E-health providemore complete and error free methods for storing patient data (Grogan 2006)[10]

By using E-health there are many benefits to different people such as doctorspatients etc For example doctorrsquos orders can be placed electronically which avoidwrong elucidation of hand wrote orders And with the help of E-health most doctorsreduces the time of locating and reading patient health information To the patient

5

they can begin to be gradually aware of the importance of self-care managementMoreover it is also convenient for maintaining only with some experts in medical andapplication developers

23232323 BarriersBarriersBarriersBarriers totototo E-HealthE-HealthE-HealthE-Health

The followings list are the main barriers to E-health

231231231231 OperationalOperationalOperationalOperational BarriersBarriersBarriersBarriersThis area of concern relates to the interoperability of systems which e-Health aims toprovide (John 2009)[11] First a system has to be developed with an interfaceallowing existing computer system to communicate with new system which e-Healthwill introduce Second there must be a common standard electronic language to crosscommunicate between different healthcare organization about the medical data suchas patient records and hospital internal record There must be formal agreement onwhat the best method to communicate such data between organizations (Hill et al2007)[12]

232232232232 CostBenefitCostBenefitCostBenefitCostBenefit BarriersBarriersBarriersBarriersAs the name suggest it is the barrier related to the cost in implementing e-Healthsolutions whether it is feasible in-terms of cost wise ie do the benefit of e-Healthoutweigh the cost required to implement E-health From the technical side theimplementation of E-health solutions is clearly advantageous in comparison with pastmethods such as the paper-based record keeping systems but from the healthcareorganization side these benefits may not outweigh the cost of implementinge-Health solutions The cost of implementing e-Health solutions can be tens ofthousands of dollars and this does not even include the requirement of hiring teamsof IT professionals to support and maintain the software throughout its life cycle(Mearian 2010)[13]

22224444 E-HealthE-HealthE-HealthE-Health inininin EUEUEUEU

Most European governments have set up combined systems of healthcare insurancein which public compulsory health insurance coexists with private companies (whichare optional most of the time) Globally the European population is aging whichtranslates into an increasing demand for healthcare and an increased cost of treatmentOn a global basis many governments in Europe are transferring expenses from publicinsurance to private ones The ongoing economic crisis leads both governments andprivate bodies to be in demand for better cost optimization leading to a globallybetter governance of the healthcare system[14]

The combination of social and policy factors described in the previous section havealready created the basis for a strong European demand for E-Health services and

6

applications Based on an analysis undertaken by Capgemini Consulting in the contextof this project the European E-Health market was about at EUR14269 million in2008 year and it is also projected to reach EUR15619 million by 2012 it grows witha rate of 29 A per-country analysis of the results confirms that France GermanyItaly Spain and the United Kingdom are the principal European E-Health marketsHowever the analysis also confirms that over the next three years all nationalE-Health markets will experience some form of growth in this area [15]

22225555 E-healthE-healthE-healthE-health RequirementRequirementRequirementRequirement

Aiming to the specific field we should take the following main parts into account thatis the designing computing and data format

InteractionInteractionInteractionInteraction designdesigndesigndesign The E-health frame should meet different rolesrsquo requirement andaccess authority management which will be used as a basic model in some specificapplication in the future For example different roles such as diabetes patients doctorsand administrator can be created and the discussion between patients and doctorsshould be available Moreover the authenticated doctor can access the specified itemsof the patients which will solve the problem of security

UIUIUIUI designdesigndesigndesign the E-health website page should be shown concise so that it should becomfortable for the users administrators and developers and the responsive webdesign was used to fulfill the requirement which can be well suited to different typedevices with flexible screen such as the PC mobile phone etc

MobilityMobilityMobilityMobility andandandand powerfulpowerfulpowerfulpowerful computingcomputingcomputingcomputing capabilitiescapabilitiescapabilitiescapabilities The E-health website should bevisited at anyplace with anytime So the real-time interaction should be an importantissue and taken into account Additionally a powerful computing capability should beowned to solve the problem that if too many users access the website

DataDataDataData FormatFormatFormatFormat The data in the system should follow the medical standard format andrules such as the unit of glucose it is mmolL The medical words should be usedseriously

DataDataDataData StorageStorageStorageStorage Considering the security issue of the data storage such as the storageformat and privacy information data protection A proper database with highersecurity level should be choose which will be further discussed in the Chapter 55

DataDataDataData PresentationPresentationPresentationPresentation In order to provide a concise and beautiful view of the dataThedata presentation can combine with different presentation formats such as histogramand table etc according the medical data requirement

7

3333 LiteratureLiteratureLiteratureLiterature RRRRevieweviewevieweview onononon ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb DesigDesigDesigDesignnnn andandandand

RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

31313131 MethodsMethodsMethodsMethods andandandand ResourcesResourcesResourcesResources

A systematic research is taken to generate meaningful result of our purpose Two mainsteps were taken to search and evaluate the results(1) Gathering sources it contains abroad search using the most relevant key words for more potential hits and whatrsquosmore a good literature review requires that you isolate key themes or issues related toyour own research interests so more restriction were added to filter the articles(2)Evaluating sources reading all the final articles with some questions kept inmindDoes the evidence support the conclusion Is the argument or evidencecomplete Does all research arrive at the same conclusion or are there differing Atlast eliminating unuseful articles with these merit and classifying all the remainedarticlesIn the first place Springer database were chosen for this literature review studyrsquos datasource it is widely used in the computer science research study and maintained bySpringer-Verlag which is one of the most famous science and technology publishcompany But in the Springer database the articles which are related to ComputerScience mostly are not related to E-health so the Google Scholar were also chosen todo this research All the key words were divided into four categories ldquoTopicrdquoldquoTechnologyrdquo ldquoProgramming Languagerdquo ldquoDevicerdquo

8

32323232 LiteratureLiteratureLiteratureLiterature SearchSearchSearchSearch

The following flow diagram show the literature review process

Figure 1 Articles Search Process

33333333 AnalysisAnalysisAnalysisAnalysis

331331331331 PublishingPublishingPublishingPublishing yearyearyearyearTable 1 Table for count of each publishing yearrsquos articlePublishingPublishingPublishingPublishing yearyearyearyear CountCountCountCount

2013 22012 62011 62010 6

2000-2010 0

The table above shows the count of reports in each publishing year The attention onresponsive web design rises from year 2010 when Ethan Marcotte put forward theconcept of RWD then it keeps the main trend and become to be popular as thenumber remain stable per year until to now

Springer database Google Scholar databaseKey words are divided into four categories(1) Topic ldquoresponsive web designrdquo(2) Technology ldquomedia-queryrdquo ldquoflexible gridrdquo(3) Programming Language ldquoNETrdquo ldquoHTML5rdquo ldquoCSS3rdquo(4) Device ldquohandheldrdquo ldquosmart-phonerdquoldquolaptoprdquo

179 articles were found (73 articles from Springerdatabase 106 articles were found from Google)

136 articles can find full text

43 articles discardedsince no full text found

71 articles were concerning about computer-basedtechnologies

20 articles were concerning about responsive webdesign

65 articles discardedsince no mention aboutcomputer technologies

51 articles discardedsince no met about

responsive web design

9

332332332332 PublishingPublishingPublishingPublishing countrycountrycountrycountryTable 2 Table for count of each countryrsquos article

PublishingPublishingPublishingPublishing countrycountrycountrycountry CountCountCountCountAustria 1Finland 2Germany 5Greece 1USA 4UK 3

Norway 1Italy 1

Sweden 2

From table above it indicates that Germany Smashing magazine put the mostefforts on responsive web design among all countries 5 related reports arepublished in Germany It can be seen that USA and UK also work hard on responsiveweb design with 4 and 3 research reports respectively The number of reports whichpublished in Europe and UK is 15 Especially Central European countries and Nordiccountries have made a major contribution to improve responsive web development 12published research papers However looking back to Asia no result are found in theresult set

33334444 QualitativeQualitativeQualitativeQualitative findingsfindingsfindingsfindings

With increasing Web users using handheld device to browse Web sites and apps Webdesigners and developers must make sure that their creations look good and workwell on mobile devices just like on traditional desktop computers

341341341341 TheTheTheThe developmentdevelopmentdevelopmentdevelopment ofofofof mobilemobilemobilemobile devicedevicedevicedevice marketmarketmarketmarketNowadays There is a large amount of site traffic comes from mobiledevicesmdashnamely smart phones and tablets(mainly the iPhone and iPad)mdashin additionto traditional personal computers Across the world mobile devices now account formore than 12 percent of Internet traffic in 2012 and this is increasing much fasterthan desktop computer and laptop Internet traffic In nations with high smart-phonepenetration the fraction of mobile Web traffic is sufficiently higher Whatrsquos more thisdata is expected to increase significantly over the next 10 years as smart-phonesdevelop and mature both in hardware and software and adoption which picks up inSouth America Asia and Africa[16]

Google company predicts that mobile devices will drive travel searches up by 15 -25 in 2013[17]

10

NASDAQ SCOR has reported that in the United State 51 of smart-phone ownersare using these handheld devices to access travel information[18]

Responsive Web Design has been cited as the No1 web design and developmenttrend for 2013 by the net magazine[19]

It is a real fact that the Smart-phone sales surpassed PC throughout the decade All ofthese are secondary in comparison to the fact that simple and clearly view in handhelddevice is needed to exist in the market of the future The figure 1 below shows thedevelopment of the mobile market

Figure 2 The Development Of Mobile Market[20]

From figure 1 we can draw the conclusion that mobile traffic is increasing incrediblyfast People check their email on mobile device first more and more people wouldlike to use high end and fast systemdevices(it is clear that the user of iPad and iPhoneoccupied the most proportion)

342342342342 SurveySurveySurveySurvey ofofofof thethethethe E-healthE-healthE-healthE-health useruseruseruserrsquorsquorsquorsquossss requirementrequirementrequirementrequirementPeople are increasingly viewing their connection to the internet including theirgadgets as their lifeline Your patients keep their address book calendar and more ontheir mobile devices They rely on them Ensuring that your website is easilyaccessible and properly optimized for mobile devices just makes sense The trendtowards patients using their mobile devices to access information will only continueto grow In fact some sources claim that by 2015 nearly everyone will access theinternet from a mobile device With such a trend it makes sense to considerresponsive web design for your medical or dental website [21]

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 7: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

3

existing cloud platform and database will be done to select a most suitable vendorThen the core part of the project will be introduced in Chapter6 This part introducethe whole project development process in detail and some encountered problems andsolutions From Chapter 7 to 10 the applicationrsquos system test evaluation conclusionsome future works and quoted reference will be included Lastly in Charter 11 somecore codes and other common infrastructure will be attached

14141414 AcknowledgementAcknowledgementAcknowledgementAcknowledgement

The special thanks will be expressed to the instructor Dr Eric Chen weekly meetingand patient conduct guide us to get a obvious understanding of the project work and abetter application design He also arranged some meetings with Kerstin Blomqvistthe expert in diabetes field which help us to gain much professional advice and guideIn addition he helps us to organize and modify the reports with great patience Thenwe will express great thanks to the Dr Kerstin and her doctoral student for selflessprofessional guidance and helps Moreover thanks for the help and cooperation fromanother data collecting and presenting group QunYing Song and JingJing Xu Lastlywe will express our thanks to the examiner DrDawit Mengistu for his advice andevaluation The whole project can be realized successfully due to their inseparableefforts to a large extent

4

2222 StudyStudyStudyStudy onononon E-healthE-healthE-healthE-health

21212121 IntroductionIntroductionIntroductionIntroduction

There are many definitions for E-Health until now but still there is no consensus onone common definition This is because of its ubiquitous and dynamic nature TheE-health information are widely used with different meanings and purposes In ourwork we develop the E-health application mostly used for diabetes patient

Joaquin (2010) who is one of the World health organization members definedE-health as the use of information and communications technologies (ICT) in favor ofhealth and health-related fields containing health-care services health supervisionhealth literature and health self-management education knowledge and research andstated that E-health has the potential to greatly improve health service efficiency itshould expand or extend treatment delivery to more than thousands of patients indeveloping countries and also improve patient results[6] In another word Mitchell defined that ldquo the combined use of electroniccommunication and information technology in the health field need to be described bya new term The use in the health sector of digital data transmitted stored andretrieved electronically both at the local site and at a distance for clinical educationaland administrative purposes rdquo(Mitchell 1999) [7]Sweden America Britain and the rest of Europe has experienced a great proliferationof health care-related websites most of which present disinformation and misleadingguidance(Fogg et al 2001)[8] And research suggests that the E-health web usersexpress the strong desire to own a online website which is used for theirself-management and directly getting advice from the doctor So the self-managementand interoperability are mostly focused in our project

22222222 AdvantagesAdvantagesAdvantagesAdvantages ofofofof E-healthE-healthE-healthE-health

There are many advantages in using E-Health concepts One key example isElectronic Health Records Before E-health came into use we used paper basedsystem to record patient health data These paper based system may have errorswhile entering the patient records into papers Coming to E-health data storeelectronically and it is more simpler and efficient way of data storing (Haumlyrinen2008)[9] Grogan stated that there is an evidence to suggest that E-health providemore complete and error free methods for storing patient data (Grogan 2006)[10]

By using E-health there are many benefits to different people such as doctorspatients etc For example doctorrsquos orders can be placed electronically which avoidwrong elucidation of hand wrote orders And with the help of E-health most doctorsreduces the time of locating and reading patient health information To the patient

5

they can begin to be gradually aware of the importance of self-care managementMoreover it is also convenient for maintaining only with some experts in medical andapplication developers

23232323 BarriersBarriersBarriersBarriers totototo E-HealthE-HealthE-HealthE-Health

The followings list are the main barriers to E-health

231231231231 OperationalOperationalOperationalOperational BarriersBarriersBarriersBarriersThis area of concern relates to the interoperability of systems which e-Health aims toprovide (John 2009)[11] First a system has to be developed with an interfaceallowing existing computer system to communicate with new system which e-Healthwill introduce Second there must be a common standard electronic language to crosscommunicate between different healthcare organization about the medical data suchas patient records and hospital internal record There must be formal agreement onwhat the best method to communicate such data between organizations (Hill et al2007)[12]

232232232232 CostBenefitCostBenefitCostBenefitCostBenefit BarriersBarriersBarriersBarriersAs the name suggest it is the barrier related to the cost in implementing e-Healthsolutions whether it is feasible in-terms of cost wise ie do the benefit of e-Healthoutweigh the cost required to implement E-health From the technical side theimplementation of E-health solutions is clearly advantageous in comparison with pastmethods such as the paper-based record keeping systems but from the healthcareorganization side these benefits may not outweigh the cost of implementinge-Health solutions The cost of implementing e-Health solutions can be tens ofthousands of dollars and this does not even include the requirement of hiring teamsof IT professionals to support and maintain the software throughout its life cycle(Mearian 2010)[13]

22224444 E-HealthE-HealthE-HealthE-Health inininin EUEUEUEU

Most European governments have set up combined systems of healthcare insurancein which public compulsory health insurance coexists with private companies (whichare optional most of the time) Globally the European population is aging whichtranslates into an increasing demand for healthcare and an increased cost of treatmentOn a global basis many governments in Europe are transferring expenses from publicinsurance to private ones The ongoing economic crisis leads both governments andprivate bodies to be in demand for better cost optimization leading to a globallybetter governance of the healthcare system[14]

The combination of social and policy factors described in the previous section havealready created the basis for a strong European demand for E-Health services and

6

applications Based on an analysis undertaken by Capgemini Consulting in the contextof this project the European E-Health market was about at EUR14269 million in2008 year and it is also projected to reach EUR15619 million by 2012 it grows witha rate of 29 A per-country analysis of the results confirms that France GermanyItaly Spain and the United Kingdom are the principal European E-Health marketsHowever the analysis also confirms that over the next three years all nationalE-Health markets will experience some form of growth in this area [15]

22225555 E-healthE-healthE-healthE-health RequirementRequirementRequirementRequirement

Aiming to the specific field we should take the following main parts into account thatis the designing computing and data format

InteractionInteractionInteractionInteraction designdesigndesigndesign The E-health frame should meet different rolesrsquo requirement andaccess authority management which will be used as a basic model in some specificapplication in the future For example different roles such as diabetes patients doctorsand administrator can be created and the discussion between patients and doctorsshould be available Moreover the authenticated doctor can access the specified itemsof the patients which will solve the problem of security

UIUIUIUI designdesigndesigndesign the E-health website page should be shown concise so that it should becomfortable for the users administrators and developers and the responsive webdesign was used to fulfill the requirement which can be well suited to different typedevices with flexible screen such as the PC mobile phone etc

MobilityMobilityMobilityMobility andandandand powerfulpowerfulpowerfulpowerful computingcomputingcomputingcomputing capabilitiescapabilitiescapabilitiescapabilities The E-health website should bevisited at anyplace with anytime So the real-time interaction should be an importantissue and taken into account Additionally a powerful computing capability should beowned to solve the problem that if too many users access the website

DataDataDataData FormatFormatFormatFormat The data in the system should follow the medical standard format andrules such as the unit of glucose it is mmolL The medical words should be usedseriously

DataDataDataData StorageStorageStorageStorage Considering the security issue of the data storage such as the storageformat and privacy information data protection A proper database with highersecurity level should be choose which will be further discussed in the Chapter 55

DataDataDataData PresentationPresentationPresentationPresentation In order to provide a concise and beautiful view of the dataThedata presentation can combine with different presentation formats such as histogramand table etc according the medical data requirement

7

3333 LiteratureLiteratureLiteratureLiterature RRRRevieweviewevieweview onononon ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb DesigDesigDesigDesignnnn andandandand

RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

31313131 MethodsMethodsMethodsMethods andandandand ResourcesResourcesResourcesResources

A systematic research is taken to generate meaningful result of our purpose Two mainsteps were taken to search and evaluate the results(1) Gathering sources it contains abroad search using the most relevant key words for more potential hits and whatrsquosmore a good literature review requires that you isolate key themes or issues related toyour own research interests so more restriction were added to filter the articles(2)Evaluating sources reading all the final articles with some questions kept inmindDoes the evidence support the conclusion Is the argument or evidencecomplete Does all research arrive at the same conclusion or are there differing Atlast eliminating unuseful articles with these merit and classifying all the remainedarticlesIn the first place Springer database were chosen for this literature review studyrsquos datasource it is widely used in the computer science research study and maintained bySpringer-Verlag which is one of the most famous science and technology publishcompany But in the Springer database the articles which are related to ComputerScience mostly are not related to E-health so the Google Scholar were also chosen todo this research All the key words were divided into four categories ldquoTopicrdquoldquoTechnologyrdquo ldquoProgramming Languagerdquo ldquoDevicerdquo

8

32323232 LiteratureLiteratureLiteratureLiterature SearchSearchSearchSearch

The following flow diagram show the literature review process

Figure 1 Articles Search Process

33333333 AnalysisAnalysisAnalysisAnalysis

331331331331 PublishingPublishingPublishingPublishing yearyearyearyearTable 1 Table for count of each publishing yearrsquos articlePublishingPublishingPublishingPublishing yearyearyearyear CountCountCountCount

2013 22012 62011 62010 6

2000-2010 0

The table above shows the count of reports in each publishing year The attention onresponsive web design rises from year 2010 when Ethan Marcotte put forward theconcept of RWD then it keeps the main trend and become to be popular as thenumber remain stable per year until to now

Springer database Google Scholar databaseKey words are divided into four categories(1) Topic ldquoresponsive web designrdquo(2) Technology ldquomedia-queryrdquo ldquoflexible gridrdquo(3) Programming Language ldquoNETrdquo ldquoHTML5rdquo ldquoCSS3rdquo(4) Device ldquohandheldrdquo ldquosmart-phonerdquoldquolaptoprdquo

179 articles were found (73 articles from Springerdatabase 106 articles were found from Google)

136 articles can find full text

43 articles discardedsince no full text found

71 articles were concerning about computer-basedtechnologies

20 articles were concerning about responsive webdesign

65 articles discardedsince no mention aboutcomputer technologies

51 articles discardedsince no met about

responsive web design

9

332332332332 PublishingPublishingPublishingPublishing countrycountrycountrycountryTable 2 Table for count of each countryrsquos article

PublishingPublishingPublishingPublishing countrycountrycountrycountry CountCountCountCountAustria 1Finland 2Germany 5Greece 1USA 4UK 3

Norway 1Italy 1

Sweden 2

From table above it indicates that Germany Smashing magazine put the mostefforts on responsive web design among all countries 5 related reports arepublished in Germany It can be seen that USA and UK also work hard on responsiveweb design with 4 and 3 research reports respectively The number of reports whichpublished in Europe and UK is 15 Especially Central European countries and Nordiccountries have made a major contribution to improve responsive web development 12published research papers However looking back to Asia no result are found in theresult set

33334444 QualitativeQualitativeQualitativeQualitative findingsfindingsfindingsfindings

With increasing Web users using handheld device to browse Web sites and apps Webdesigners and developers must make sure that their creations look good and workwell on mobile devices just like on traditional desktop computers

341341341341 TheTheTheThe developmentdevelopmentdevelopmentdevelopment ofofofof mobilemobilemobilemobile devicedevicedevicedevice marketmarketmarketmarketNowadays There is a large amount of site traffic comes from mobiledevicesmdashnamely smart phones and tablets(mainly the iPhone and iPad)mdashin additionto traditional personal computers Across the world mobile devices now account formore than 12 percent of Internet traffic in 2012 and this is increasing much fasterthan desktop computer and laptop Internet traffic In nations with high smart-phonepenetration the fraction of mobile Web traffic is sufficiently higher Whatrsquos more thisdata is expected to increase significantly over the next 10 years as smart-phonesdevelop and mature both in hardware and software and adoption which picks up inSouth America Asia and Africa[16]

Google company predicts that mobile devices will drive travel searches up by 15 -25 in 2013[17]

10

NASDAQ SCOR has reported that in the United State 51 of smart-phone ownersare using these handheld devices to access travel information[18]

Responsive Web Design has been cited as the No1 web design and developmenttrend for 2013 by the net magazine[19]

It is a real fact that the Smart-phone sales surpassed PC throughout the decade All ofthese are secondary in comparison to the fact that simple and clearly view in handhelddevice is needed to exist in the market of the future The figure 1 below shows thedevelopment of the mobile market

Figure 2 The Development Of Mobile Market[20]

From figure 1 we can draw the conclusion that mobile traffic is increasing incrediblyfast People check their email on mobile device first more and more people wouldlike to use high end and fast systemdevices(it is clear that the user of iPad and iPhoneoccupied the most proportion)

342342342342 SurveySurveySurveySurvey ofofofof thethethethe E-healthE-healthE-healthE-health useruseruseruserrsquorsquorsquorsquossss requirementrequirementrequirementrequirementPeople are increasingly viewing their connection to the internet including theirgadgets as their lifeline Your patients keep their address book calendar and more ontheir mobile devices They rely on them Ensuring that your website is easilyaccessible and properly optimized for mobile devices just makes sense The trendtowards patients using their mobile devices to access information will only continueto grow In fact some sources claim that by 2015 nearly everyone will access theinternet from a mobile device With such a trend it makes sense to considerresponsive web design for your medical or dental website [21]

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 8: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

4

2222 StudyStudyStudyStudy onononon E-healthE-healthE-healthE-health

21212121 IntroductionIntroductionIntroductionIntroduction

There are many definitions for E-Health until now but still there is no consensus onone common definition This is because of its ubiquitous and dynamic nature TheE-health information are widely used with different meanings and purposes In ourwork we develop the E-health application mostly used for diabetes patient

Joaquin (2010) who is one of the World health organization members definedE-health as the use of information and communications technologies (ICT) in favor ofhealth and health-related fields containing health-care services health supervisionhealth literature and health self-management education knowledge and research andstated that E-health has the potential to greatly improve health service efficiency itshould expand or extend treatment delivery to more than thousands of patients indeveloping countries and also improve patient results[6] In another word Mitchell defined that ldquo the combined use of electroniccommunication and information technology in the health field need to be described bya new term The use in the health sector of digital data transmitted stored andretrieved electronically both at the local site and at a distance for clinical educationaland administrative purposes rdquo(Mitchell 1999) [7]Sweden America Britain and the rest of Europe has experienced a great proliferationof health care-related websites most of which present disinformation and misleadingguidance(Fogg et al 2001)[8] And research suggests that the E-health web usersexpress the strong desire to own a online website which is used for theirself-management and directly getting advice from the doctor So the self-managementand interoperability are mostly focused in our project

22222222 AdvantagesAdvantagesAdvantagesAdvantages ofofofof E-healthE-healthE-healthE-health

There are many advantages in using E-Health concepts One key example isElectronic Health Records Before E-health came into use we used paper basedsystem to record patient health data These paper based system may have errorswhile entering the patient records into papers Coming to E-health data storeelectronically and it is more simpler and efficient way of data storing (Haumlyrinen2008)[9] Grogan stated that there is an evidence to suggest that E-health providemore complete and error free methods for storing patient data (Grogan 2006)[10]

By using E-health there are many benefits to different people such as doctorspatients etc For example doctorrsquos orders can be placed electronically which avoidwrong elucidation of hand wrote orders And with the help of E-health most doctorsreduces the time of locating and reading patient health information To the patient

5

they can begin to be gradually aware of the importance of self-care managementMoreover it is also convenient for maintaining only with some experts in medical andapplication developers

23232323 BarriersBarriersBarriersBarriers totototo E-HealthE-HealthE-HealthE-Health

The followings list are the main barriers to E-health

231231231231 OperationalOperationalOperationalOperational BarriersBarriersBarriersBarriersThis area of concern relates to the interoperability of systems which e-Health aims toprovide (John 2009)[11] First a system has to be developed with an interfaceallowing existing computer system to communicate with new system which e-Healthwill introduce Second there must be a common standard electronic language to crosscommunicate between different healthcare organization about the medical data suchas patient records and hospital internal record There must be formal agreement onwhat the best method to communicate such data between organizations (Hill et al2007)[12]

232232232232 CostBenefitCostBenefitCostBenefitCostBenefit BarriersBarriersBarriersBarriersAs the name suggest it is the barrier related to the cost in implementing e-Healthsolutions whether it is feasible in-terms of cost wise ie do the benefit of e-Healthoutweigh the cost required to implement E-health From the technical side theimplementation of E-health solutions is clearly advantageous in comparison with pastmethods such as the paper-based record keeping systems but from the healthcareorganization side these benefits may not outweigh the cost of implementinge-Health solutions The cost of implementing e-Health solutions can be tens ofthousands of dollars and this does not even include the requirement of hiring teamsof IT professionals to support and maintain the software throughout its life cycle(Mearian 2010)[13]

22224444 E-HealthE-HealthE-HealthE-Health inininin EUEUEUEU

Most European governments have set up combined systems of healthcare insurancein which public compulsory health insurance coexists with private companies (whichare optional most of the time) Globally the European population is aging whichtranslates into an increasing demand for healthcare and an increased cost of treatmentOn a global basis many governments in Europe are transferring expenses from publicinsurance to private ones The ongoing economic crisis leads both governments andprivate bodies to be in demand for better cost optimization leading to a globallybetter governance of the healthcare system[14]

The combination of social and policy factors described in the previous section havealready created the basis for a strong European demand for E-Health services and

6

applications Based on an analysis undertaken by Capgemini Consulting in the contextof this project the European E-Health market was about at EUR14269 million in2008 year and it is also projected to reach EUR15619 million by 2012 it grows witha rate of 29 A per-country analysis of the results confirms that France GermanyItaly Spain and the United Kingdom are the principal European E-Health marketsHowever the analysis also confirms that over the next three years all nationalE-Health markets will experience some form of growth in this area [15]

22225555 E-healthE-healthE-healthE-health RequirementRequirementRequirementRequirement

Aiming to the specific field we should take the following main parts into account thatis the designing computing and data format

InteractionInteractionInteractionInteraction designdesigndesigndesign The E-health frame should meet different rolesrsquo requirement andaccess authority management which will be used as a basic model in some specificapplication in the future For example different roles such as diabetes patients doctorsand administrator can be created and the discussion between patients and doctorsshould be available Moreover the authenticated doctor can access the specified itemsof the patients which will solve the problem of security

UIUIUIUI designdesigndesigndesign the E-health website page should be shown concise so that it should becomfortable for the users administrators and developers and the responsive webdesign was used to fulfill the requirement which can be well suited to different typedevices with flexible screen such as the PC mobile phone etc

MobilityMobilityMobilityMobility andandandand powerfulpowerfulpowerfulpowerful computingcomputingcomputingcomputing capabilitiescapabilitiescapabilitiescapabilities The E-health website should bevisited at anyplace with anytime So the real-time interaction should be an importantissue and taken into account Additionally a powerful computing capability should beowned to solve the problem that if too many users access the website

DataDataDataData FormatFormatFormatFormat The data in the system should follow the medical standard format andrules such as the unit of glucose it is mmolL The medical words should be usedseriously

DataDataDataData StorageStorageStorageStorage Considering the security issue of the data storage such as the storageformat and privacy information data protection A proper database with highersecurity level should be choose which will be further discussed in the Chapter 55

DataDataDataData PresentationPresentationPresentationPresentation In order to provide a concise and beautiful view of the dataThedata presentation can combine with different presentation formats such as histogramand table etc according the medical data requirement

7

3333 LiteratureLiteratureLiteratureLiterature RRRRevieweviewevieweview onononon ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb DesigDesigDesigDesignnnn andandandand

RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

31313131 MethodsMethodsMethodsMethods andandandand ResourcesResourcesResourcesResources

A systematic research is taken to generate meaningful result of our purpose Two mainsteps were taken to search and evaluate the results(1) Gathering sources it contains abroad search using the most relevant key words for more potential hits and whatrsquosmore a good literature review requires that you isolate key themes or issues related toyour own research interests so more restriction were added to filter the articles(2)Evaluating sources reading all the final articles with some questions kept inmindDoes the evidence support the conclusion Is the argument or evidencecomplete Does all research arrive at the same conclusion or are there differing Atlast eliminating unuseful articles with these merit and classifying all the remainedarticlesIn the first place Springer database were chosen for this literature review studyrsquos datasource it is widely used in the computer science research study and maintained bySpringer-Verlag which is one of the most famous science and technology publishcompany But in the Springer database the articles which are related to ComputerScience mostly are not related to E-health so the Google Scholar were also chosen todo this research All the key words were divided into four categories ldquoTopicrdquoldquoTechnologyrdquo ldquoProgramming Languagerdquo ldquoDevicerdquo

8

32323232 LiteratureLiteratureLiteratureLiterature SearchSearchSearchSearch

The following flow diagram show the literature review process

Figure 1 Articles Search Process

33333333 AnalysisAnalysisAnalysisAnalysis

331331331331 PublishingPublishingPublishingPublishing yearyearyearyearTable 1 Table for count of each publishing yearrsquos articlePublishingPublishingPublishingPublishing yearyearyearyear CountCountCountCount

2013 22012 62011 62010 6

2000-2010 0

The table above shows the count of reports in each publishing year The attention onresponsive web design rises from year 2010 when Ethan Marcotte put forward theconcept of RWD then it keeps the main trend and become to be popular as thenumber remain stable per year until to now

Springer database Google Scholar databaseKey words are divided into four categories(1) Topic ldquoresponsive web designrdquo(2) Technology ldquomedia-queryrdquo ldquoflexible gridrdquo(3) Programming Language ldquoNETrdquo ldquoHTML5rdquo ldquoCSS3rdquo(4) Device ldquohandheldrdquo ldquosmart-phonerdquoldquolaptoprdquo

179 articles were found (73 articles from Springerdatabase 106 articles were found from Google)

136 articles can find full text

43 articles discardedsince no full text found

71 articles were concerning about computer-basedtechnologies

20 articles were concerning about responsive webdesign

65 articles discardedsince no mention aboutcomputer technologies

51 articles discardedsince no met about

responsive web design

9

332332332332 PublishingPublishingPublishingPublishing countrycountrycountrycountryTable 2 Table for count of each countryrsquos article

PublishingPublishingPublishingPublishing countrycountrycountrycountry CountCountCountCountAustria 1Finland 2Germany 5Greece 1USA 4UK 3

Norway 1Italy 1

Sweden 2

From table above it indicates that Germany Smashing magazine put the mostefforts on responsive web design among all countries 5 related reports arepublished in Germany It can be seen that USA and UK also work hard on responsiveweb design with 4 and 3 research reports respectively The number of reports whichpublished in Europe and UK is 15 Especially Central European countries and Nordiccountries have made a major contribution to improve responsive web development 12published research papers However looking back to Asia no result are found in theresult set

33334444 QualitativeQualitativeQualitativeQualitative findingsfindingsfindingsfindings

With increasing Web users using handheld device to browse Web sites and apps Webdesigners and developers must make sure that their creations look good and workwell on mobile devices just like on traditional desktop computers

341341341341 TheTheTheThe developmentdevelopmentdevelopmentdevelopment ofofofof mobilemobilemobilemobile devicedevicedevicedevice marketmarketmarketmarketNowadays There is a large amount of site traffic comes from mobiledevicesmdashnamely smart phones and tablets(mainly the iPhone and iPad)mdashin additionto traditional personal computers Across the world mobile devices now account formore than 12 percent of Internet traffic in 2012 and this is increasing much fasterthan desktop computer and laptop Internet traffic In nations with high smart-phonepenetration the fraction of mobile Web traffic is sufficiently higher Whatrsquos more thisdata is expected to increase significantly over the next 10 years as smart-phonesdevelop and mature both in hardware and software and adoption which picks up inSouth America Asia and Africa[16]

Google company predicts that mobile devices will drive travel searches up by 15 -25 in 2013[17]

10

NASDAQ SCOR has reported that in the United State 51 of smart-phone ownersare using these handheld devices to access travel information[18]

Responsive Web Design has been cited as the No1 web design and developmenttrend for 2013 by the net magazine[19]

It is a real fact that the Smart-phone sales surpassed PC throughout the decade All ofthese are secondary in comparison to the fact that simple and clearly view in handhelddevice is needed to exist in the market of the future The figure 1 below shows thedevelopment of the mobile market

Figure 2 The Development Of Mobile Market[20]

From figure 1 we can draw the conclusion that mobile traffic is increasing incrediblyfast People check their email on mobile device first more and more people wouldlike to use high end and fast systemdevices(it is clear that the user of iPad and iPhoneoccupied the most proportion)

342342342342 SurveySurveySurveySurvey ofofofof thethethethe E-healthE-healthE-healthE-health useruseruseruserrsquorsquorsquorsquossss requirementrequirementrequirementrequirementPeople are increasingly viewing their connection to the internet including theirgadgets as their lifeline Your patients keep their address book calendar and more ontheir mobile devices They rely on them Ensuring that your website is easilyaccessible and properly optimized for mobile devices just makes sense The trendtowards patients using their mobile devices to access information will only continueto grow In fact some sources claim that by 2015 nearly everyone will access theinternet from a mobile device With such a trend it makes sense to considerresponsive web design for your medical or dental website [21]

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 9: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

5

they can begin to be gradually aware of the importance of self-care managementMoreover it is also convenient for maintaining only with some experts in medical andapplication developers

23232323 BarriersBarriersBarriersBarriers totototo E-HealthE-HealthE-HealthE-Health

The followings list are the main barriers to E-health

231231231231 OperationalOperationalOperationalOperational BarriersBarriersBarriersBarriersThis area of concern relates to the interoperability of systems which e-Health aims toprovide (John 2009)[11] First a system has to be developed with an interfaceallowing existing computer system to communicate with new system which e-Healthwill introduce Second there must be a common standard electronic language to crosscommunicate between different healthcare organization about the medical data suchas patient records and hospital internal record There must be formal agreement onwhat the best method to communicate such data between organizations (Hill et al2007)[12]

232232232232 CostBenefitCostBenefitCostBenefitCostBenefit BarriersBarriersBarriersBarriersAs the name suggest it is the barrier related to the cost in implementing e-Healthsolutions whether it is feasible in-terms of cost wise ie do the benefit of e-Healthoutweigh the cost required to implement E-health From the technical side theimplementation of E-health solutions is clearly advantageous in comparison with pastmethods such as the paper-based record keeping systems but from the healthcareorganization side these benefits may not outweigh the cost of implementinge-Health solutions The cost of implementing e-Health solutions can be tens ofthousands of dollars and this does not even include the requirement of hiring teamsof IT professionals to support and maintain the software throughout its life cycle(Mearian 2010)[13]

22224444 E-HealthE-HealthE-HealthE-Health inininin EUEUEUEU

Most European governments have set up combined systems of healthcare insurancein which public compulsory health insurance coexists with private companies (whichare optional most of the time) Globally the European population is aging whichtranslates into an increasing demand for healthcare and an increased cost of treatmentOn a global basis many governments in Europe are transferring expenses from publicinsurance to private ones The ongoing economic crisis leads both governments andprivate bodies to be in demand for better cost optimization leading to a globallybetter governance of the healthcare system[14]

The combination of social and policy factors described in the previous section havealready created the basis for a strong European demand for E-Health services and

6

applications Based on an analysis undertaken by Capgemini Consulting in the contextof this project the European E-Health market was about at EUR14269 million in2008 year and it is also projected to reach EUR15619 million by 2012 it grows witha rate of 29 A per-country analysis of the results confirms that France GermanyItaly Spain and the United Kingdom are the principal European E-Health marketsHowever the analysis also confirms that over the next three years all nationalE-Health markets will experience some form of growth in this area [15]

22225555 E-healthE-healthE-healthE-health RequirementRequirementRequirementRequirement

Aiming to the specific field we should take the following main parts into account thatis the designing computing and data format

InteractionInteractionInteractionInteraction designdesigndesigndesign The E-health frame should meet different rolesrsquo requirement andaccess authority management which will be used as a basic model in some specificapplication in the future For example different roles such as diabetes patients doctorsand administrator can be created and the discussion between patients and doctorsshould be available Moreover the authenticated doctor can access the specified itemsof the patients which will solve the problem of security

UIUIUIUI designdesigndesigndesign the E-health website page should be shown concise so that it should becomfortable for the users administrators and developers and the responsive webdesign was used to fulfill the requirement which can be well suited to different typedevices with flexible screen such as the PC mobile phone etc

MobilityMobilityMobilityMobility andandandand powerfulpowerfulpowerfulpowerful computingcomputingcomputingcomputing capabilitiescapabilitiescapabilitiescapabilities The E-health website should bevisited at anyplace with anytime So the real-time interaction should be an importantissue and taken into account Additionally a powerful computing capability should beowned to solve the problem that if too many users access the website

DataDataDataData FormatFormatFormatFormat The data in the system should follow the medical standard format andrules such as the unit of glucose it is mmolL The medical words should be usedseriously

DataDataDataData StorageStorageStorageStorage Considering the security issue of the data storage such as the storageformat and privacy information data protection A proper database with highersecurity level should be choose which will be further discussed in the Chapter 55

DataDataDataData PresentationPresentationPresentationPresentation In order to provide a concise and beautiful view of the dataThedata presentation can combine with different presentation formats such as histogramand table etc according the medical data requirement

7

3333 LiteratureLiteratureLiteratureLiterature RRRRevieweviewevieweview onononon ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb DesigDesigDesigDesignnnn andandandand

RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

31313131 MethodsMethodsMethodsMethods andandandand ResourcesResourcesResourcesResources

A systematic research is taken to generate meaningful result of our purpose Two mainsteps were taken to search and evaluate the results(1) Gathering sources it contains abroad search using the most relevant key words for more potential hits and whatrsquosmore a good literature review requires that you isolate key themes or issues related toyour own research interests so more restriction were added to filter the articles(2)Evaluating sources reading all the final articles with some questions kept inmindDoes the evidence support the conclusion Is the argument or evidencecomplete Does all research arrive at the same conclusion or are there differing Atlast eliminating unuseful articles with these merit and classifying all the remainedarticlesIn the first place Springer database were chosen for this literature review studyrsquos datasource it is widely used in the computer science research study and maintained bySpringer-Verlag which is one of the most famous science and technology publishcompany But in the Springer database the articles which are related to ComputerScience mostly are not related to E-health so the Google Scholar were also chosen todo this research All the key words were divided into four categories ldquoTopicrdquoldquoTechnologyrdquo ldquoProgramming Languagerdquo ldquoDevicerdquo

8

32323232 LiteratureLiteratureLiteratureLiterature SearchSearchSearchSearch

The following flow diagram show the literature review process

Figure 1 Articles Search Process

33333333 AnalysisAnalysisAnalysisAnalysis

331331331331 PublishingPublishingPublishingPublishing yearyearyearyearTable 1 Table for count of each publishing yearrsquos articlePublishingPublishingPublishingPublishing yearyearyearyear CountCountCountCount

2013 22012 62011 62010 6

2000-2010 0

The table above shows the count of reports in each publishing year The attention onresponsive web design rises from year 2010 when Ethan Marcotte put forward theconcept of RWD then it keeps the main trend and become to be popular as thenumber remain stable per year until to now

Springer database Google Scholar databaseKey words are divided into four categories(1) Topic ldquoresponsive web designrdquo(2) Technology ldquomedia-queryrdquo ldquoflexible gridrdquo(3) Programming Language ldquoNETrdquo ldquoHTML5rdquo ldquoCSS3rdquo(4) Device ldquohandheldrdquo ldquosmart-phonerdquoldquolaptoprdquo

179 articles were found (73 articles from Springerdatabase 106 articles were found from Google)

136 articles can find full text

43 articles discardedsince no full text found

71 articles were concerning about computer-basedtechnologies

20 articles were concerning about responsive webdesign

65 articles discardedsince no mention aboutcomputer technologies

51 articles discardedsince no met about

responsive web design

9

332332332332 PublishingPublishingPublishingPublishing countrycountrycountrycountryTable 2 Table for count of each countryrsquos article

PublishingPublishingPublishingPublishing countrycountrycountrycountry CountCountCountCountAustria 1Finland 2Germany 5Greece 1USA 4UK 3

Norway 1Italy 1

Sweden 2

From table above it indicates that Germany Smashing magazine put the mostefforts on responsive web design among all countries 5 related reports arepublished in Germany It can be seen that USA and UK also work hard on responsiveweb design with 4 and 3 research reports respectively The number of reports whichpublished in Europe and UK is 15 Especially Central European countries and Nordiccountries have made a major contribution to improve responsive web development 12published research papers However looking back to Asia no result are found in theresult set

33334444 QualitativeQualitativeQualitativeQualitative findingsfindingsfindingsfindings

With increasing Web users using handheld device to browse Web sites and apps Webdesigners and developers must make sure that their creations look good and workwell on mobile devices just like on traditional desktop computers

341341341341 TheTheTheThe developmentdevelopmentdevelopmentdevelopment ofofofof mobilemobilemobilemobile devicedevicedevicedevice marketmarketmarketmarketNowadays There is a large amount of site traffic comes from mobiledevicesmdashnamely smart phones and tablets(mainly the iPhone and iPad)mdashin additionto traditional personal computers Across the world mobile devices now account formore than 12 percent of Internet traffic in 2012 and this is increasing much fasterthan desktop computer and laptop Internet traffic In nations with high smart-phonepenetration the fraction of mobile Web traffic is sufficiently higher Whatrsquos more thisdata is expected to increase significantly over the next 10 years as smart-phonesdevelop and mature both in hardware and software and adoption which picks up inSouth America Asia and Africa[16]

Google company predicts that mobile devices will drive travel searches up by 15 -25 in 2013[17]

10

NASDAQ SCOR has reported that in the United State 51 of smart-phone ownersare using these handheld devices to access travel information[18]

Responsive Web Design has been cited as the No1 web design and developmenttrend for 2013 by the net magazine[19]

It is a real fact that the Smart-phone sales surpassed PC throughout the decade All ofthese are secondary in comparison to the fact that simple and clearly view in handhelddevice is needed to exist in the market of the future The figure 1 below shows thedevelopment of the mobile market

Figure 2 The Development Of Mobile Market[20]

From figure 1 we can draw the conclusion that mobile traffic is increasing incrediblyfast People check their email on mobile device first more and more people wouldlike to use high end and fast systemdevices(it is clear that the user of iPad and iPhoneoccupied the most proportion)

342342342342 SurveySurveySurveySurvey ofofofof thethethethe E-healthE-healthE-healthE-health useruseruseruserrsquorsquorsquorsquossss requirementrequirementrequirementrequirementPeople are increasingly viewing their connection to the internet including theirgadgets as their lifeline Your patients keep their address book calendar and more ontheir mobile devices They rely on them Ensuring that your website is easilyaccessible and properly optimized for mobile devices just makes sense The trendtowards patients using their mobile devices to access information will only continueto grow In fact some sources claim that by 2015 nearly everyone will access theinternet from a mobile device With such a trend it makes sense to considerresponsive web design for your medical or dental website [21]

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 10: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

6

applications Based on an analysis undertaken by Capgemini Consulting in the contextof this project the European E-Health market was about at EUR14269 million in2008 year and it is also projected to reach EUR15619 million by 2012 it grows witha rate of 29 A per-country analysis of the results confirms that France GermanyItaly Spain and the United Kingdom are the principal European E-Health marketsHowever the analysis also confirms that over the next three years all nationalE-Health markets will experience some form of growth in this area [15]

22225555 E-healthE-healthE-healthE-health RequirementRequirementRequirementRequirement

Aiming to the specific field we should take the following main parts into account thatis the designing computing and data format

InteractionInteractionInteractionInteraction designdesigndesigndesign The E-health frame should meet different rolesrsquo requirement andaccess authority management which will be used as a basic model in some specificapplication in the future For example different roles such as diabetes patients doctorsand administrator can be created and the discussion between patients and doctorsshould be available Moreover the authenticated doctor can access the specified itemsof the patients which will solve the problem of security

UIUIUIUI designdesigndesigndesign the E-health website page should be shown concise so that it should becomfortable for the users administrators and developers and the responsive webdesign was used to fulfill the requirement which can be well suited to different typedevices with flexible screen such as the PC mobile phone etc

MobilityMobilityMobilityMobility andandandand powerfulpowerfulpowerfulpowerful computingcomputingcomputingcomputing capabilitiescapabilitiescapabilitiescapabilities The E-health website should bevisited at anyplace with anytime So the real-time interaction should be an importantissue and taken into account Additionally a powerful computing capability should beowned to solve the problem that if too many users access the website

DataDataDataData FormatFormatFormatFormat The data in the system should follow the medical standard format andrules such as the unit of glucose it is mmolL The medical words should be usedseriously

DataDataDataData StorageStorageStorageStorage Considering the security issue of the data storage such as the storageformat and privacy information data protection A proper database with highersecurity level should be choose which will be further discussed in the Chapter 55

DataDataDataData PresentationPresentationPresentationPresentation In order to provide a concise and beautiful view of the dataThedata presentation can combine with different presentation formats such as histogramand table etc according the medical data requirement

7

3333 LiteratureLiteratureLiteratureLiterature RRRRevieweviewevieweview onononon ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb DesigDesigDesigDesignnnn andandandand

RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

31313131 MethodsMethodsMethodsMethods andandandand ResourcesResourcesResourcesResources

A systematic research is taken to generate meaningful result of our purpose Two mainsteps were taken to search and evaluate the results(1) Gathering sources it contains abroad search using the most relevant key words for more potential hits and whatrsquosmore a good literature review requires that you isolate key themes or issues related toyour own research interests so more restriction were added to filter the articles(2)Evaluating sources reading all the final articles with some questions kept inmindDoes the evidence support the conclusion Is the argument or evidencecomplete Does all research arrive at the same conclusion or are there differing Atlast eliminating unuseful articles with these merit and classifying all the remainedarticlesIn the first place Springer database were chosen for this literature review studyrsquos datasource it is widely used in the computer science research study and maintained bySpringer-Verlag which is one of the most famous science and technology publishcompany But in the Springer database the articles which are related to ComputerScience mostly are not related to E-health so the Google Scholar were also chosen todo this research All the key words were divided into four categories ldquoTopicrdquoldquoTechnologyrdquo ldquoProgramming Languagerdquo ldquoDevicerdquo

8

32323232 LiteratureLiteratureLiteratureLiterature SearchSearchSearchSearch

The following flow diagram show the literature review process

Figure 1 Articles Search Process

33333333 AnalysisAnalysisAnalysisAnalysis

331331331331 PublishingPublishingPublishingPublishing yearyearyearyearTable 1 Table for count of each publishing yearrsquos articlePublishingPublishingPublishingPublishing yearyearyearyear CountCountCountCount

2013 22012 62011 62010 6

2000-2010 0

The table above shows the count of reports in each publishing year The attention onresponsive web design rises from year 2010 when Ethan Marcotte put forward theconcept of RWD then it keeps the main trend and become to be popular as thenumber remain stable per year until to now

Springer database Google Scholar databaseKey words are divided into four categories(1) Topic ldquoresponsive web designrdquo(2) Technology ldquomedia-queryrdquo ldquoflexible gridrdquo(3) Programming Language ldquoNETrdquo ldquoHTML5rdquo ldquoCSS3rdquo(4) Device ldquohandheldrdquo ldquosmart-phonerdquoldquolaptoprdquo

179 articles were found (73 articles from Springerdatabase 106 articles were found from Google)

136 articles can find full text

43 articles discardedsince no full text found

71 articles were concerning about computer-basedtechnologies

20 articles were concerning about responsive webdesign

65 articles discardedsince no mention aboutcomputer technologies

51 articles discardedsince no met about

responsive web design

9

332332332332 PublishingPublishingPublishingPublishing countrycountrycountrycountryTable 2 Table for count of each countryrsquos article

PublishingPublishingPublishingPublishing countrycountrycountrycountry CountCountCountCountAustria 1Finland 2Germany 5Greece 1USA 4UK 3

Norway 1Italy 1

Sweden 2

From table above it indicates that Germany Smashing magazine put the mostefforts on responsive web design among all countries 5 related reports arepublished in Germany It can be seen that USA and UK also work hard on responsiveweb design with 4 and 3 research reports respectively The number of reports whichpublished in Europe and UK is 15 Especially Central European countries and Nordiccountries have made a major contribution to improve responsive web development 12published research papers However looking back to Asia no result are found in theresult set

33334444 QualitativeQualitativeQualitativeQualitative findingsfindingsfindingsfindings

With increasing Web users using handheld device to browse Web sites and apps Webdesigners and developers must make sure that their creations look good and workwell on mobile devices just like on traditional desktop computers

341341341341 TheTheTheThe developmentdevelopmentdevelopmentdevelopment ofofofof mobilemobilemobilemobile devicedevicedevicedevice marketmarketmarketmarketNowadays There is a large amount of site traffic comes from mobiledevicesmdashnamely smart phones and tablets(mainly the iPhone and iPad)mdashin additionto traditional personal computers Across the world mobile devices now account formore than 12 percent of Internet traffic in 2012 and this is increasing much fasterthan desktop computer and laptop Internet traffic In nations with high smart-phonepenetration the fraction of mobile Web traffic is sufficiently higher Whatrsquos more thisdata is expected to increase significantly over the next 10 years as smart-phonesdevelop and mature both in hardware and software and adoption which picks up inSouth America Asia and Africa[16]

Google company predicts that mobile devices will drive travel searches up by 15 -25 in 2013[17]

10

NASDAQ SCOR has reported that in the United State 51 of smart-phone ownersare using these handheld devices to access travel information[18]

Responsive Web Design has been cited as the No1 web design and developmenttrend for 2013 by the net magazine[19]

It is a real fact that the Smart-phone sales surpassed PC throughout the decade All ofthese are secondary in comparison to the fact that simple and clearly view in handhelddevice is needed to exist in the market of the future The figure 1 below shows thedevelopment of the mobile market

Figure 2 The Development Of Mobile Market[20]

From figure 1 we can draw the conclusion that mobile traffic is increasing incrediblyfast People check their email on mobile device first more and more people wouldlike to use high end and fast systemdevices(it is clear that the user of iPad and iPhoneoccupied the most proportion)

342342342342 SurveySurveySurveySurvey ofofofof thethethethe E-healthE-healthE-healthE-health useruseruseruserrsquorsquorsquorsquossss requirementrequirementrequirementrequirementPeople are increasingly viewing their connection to the internet including theirgadgets as their lifeline Your patients keep their address book calendar and more ontheir mobile devices They rely on them Ensuring that your website is easilyaccessible and properly optimized for mobile devices just makes sense The trendtowards patients using their mobile devices to access information will only continueto grow In fact some sources claim that by 2015 nearly everyone will access theinternet from a mobile device With such a trend it makes sense to considerresponsive web design for your medical or dental website [21]

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 11: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

7

3333 LiteratureLiteratureLiteratureLiterature RRRRevieweviewevieweview onononon ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb DesigDesigDesigDesignnnn andandandand

RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

31313131 MethodsMethodsMethodsMethods andandandand ResourcesResourcesResourcesResources

A systematic research is taken to generate meaningful result of our purpose Two mainsteps were taken to search and evaluate the results(1) Gathering sources it contains abroad search using the most relevant key words for more potential hits and whatrsquosmore a good literature review requires that you isolate key themes or issues related toyour own research interests so more restriction were added to filter the articles(2)Evaluating sources reading all the final articles with some questions kept inmindDoes the evidence support the conclusion Is the argument or evidencecomplete Does all research arrive at the same conclusion or are there differing Atlast eliminating unuseful articles with these merit and classifying all the remainedarticlesIn the first place Springer database were chosen for this literature review studyrsquos datasource it is widely used in the computer science research study and maintained bySpringer-Verlag which is one of the most famous science and technology publishcompany But in the Springer database the articles which are related to ComputerScience mostly are not related to E-health so the Google Scholar were also chosen todo this research All the key words were divided into four categories ldquoTopicrdquoldquoTechnologyrdquo ldquoProgramming Languagerdquo ldquoDevicerdquo

8

32323232 LiteratureLiteratureLiteratureLiterature SearchSearchSearchSearch

The following flow diagram show the literature review process

Figure 1 Articles Search Process

33333333 AnalysisAnalysisAnalysisAnalysis

331331331331 PublishingPublishingPublishingPublishing yearyearyearyearTable 1 Table for count of each publishing yearrsquos articlePublishingPublishingPublishingPublishing yearyearyearyear CountCountCountCount

2013 22012 62011 62010 6

2000-2010 0

The table above shows the count of reports in each publishing year The attention onresponsive web design rises from year 2010 when Ethan Marcotte put forward theconcept of RWD then it keeps the main trend and become to be popular as thenumber remain stable per year until to now

Springer database Google Scholar databaseKey words are divided into four categories(1) Topic ldquoresponsive web designrdquo(2) Technology ldquomedia-queryrdquo ldquoflexible gridrdquo(3) Programming Language ldquoNETrdquo ldquoHTML5rdquo ldquoCSS3rdquo(4) Device ldquohandheldrdquo ldquosmart-phonerdquoldquolaptoprdquo

179 articles were found (73 articles from Springerdatabase 106 articles were found from Google)

136 articles can find full text

43 articles discardedsince no full text found

71 articles were concerning about computer-basedtechnologies

20 articles were concerning about responsive webdesign

65 articles discardedsince no mention aboutcomputer technologies

51 articles discardedsince no met about

responsive web design

9

332332332332 PublishingPublishingPublishingPublishing countrycountrycountrycountryTable 2 Table for count of each countryrsquos article

PublishingPublishingPublishingPublishing countrycountrycountrycountry CountCountCountCountAustria 1Finland 2Germany 5Greece 1USA 4UK 3

Norway 1Italy 1

Sweden 2

From table above it indicates that Germany Smashing magazine put the mostefforts on responsive web design among all countries 5 related reports arepublished in Germany It can be seen that USA and UK also work hard on responsiveweb design with 4 and 3 research reports respectively The number of reports whichpublished in Europe and UK is 15 Especially Central European countries and Nordiccountries have made a major contribution to improve responsive web development 12published research papers However looking back to Asia no result are found in theresult set

33334444 QualitativeQualitativeQualitativeQualitative findingsfindingsfindingsfindings

With increasing Web users using handheld device to browse Web sites and apps Webdesigners and developers must make sure that their creations look good and workwell on mobile devices just like on traditional desktop computers

341341341341 TheTheTheThe developmentdevelopmentdevelopmentdevelopment ofofofof mobilemobilemobilemobile devicedevicedevicedevice marketmarketmarketmarketNowadays There is a large amount of site traffic comes from mobiledevicesmdashnamely smart phones and tablets(mainly the iPhone and iPad)mdashin additionto traditional personal computers Across the world mobile devices now account formore than 12 percent of Internet traffic in 2012 and this is increasing much fasterthan desktop computer and laptop Internet traffic In nations with high smart-phonepenetration the fraction of mobile Web traffic is sufficiently higher Whatrsquos more thisdata is expected to increase significantly over the next 10 years as smart-phonesdevelop and mature both in hardware and software and adoption which picks up inSouth America Asia and Africa[16]

Google company predicts that mobile devices will drive travel searches up by 15 -25 in 2013[17]

10

NASDAQ SCOR has reported that in the United State 51 of smart-phone ownersare using these handheld devices to access travel information[18]

Responsive Web Design has been cited as the No1 web design and developmenttrend for 2013 by the net magazine[19]

It is a real fact that the Smart-phone sales surpassed PC throughout the decade All ofthese are secondary in comparison to the fact that simple and clearly view in handhelddevice is needed to exist in the market of the future The figure 1 below shows thedevelopment of the mobile market

Figure 2 The Development Of Mobile Market[20]

From figure 1 we can draw the conclusion that mobile traffic is increasing incrediblyfast People check their email on mobile device first more and more people wouldlike to use high end and fast systemdevices(it is clear that the user of iPad and iPhoneoccupied the most proportion)

342342342342 SurveySurveySurveySurvey ofofofof thethethethe E-healthE-healthE-healthE-health useruseruseruserrsquorsquorsquorsquossss requirementrequirementrequirementrequirementPeople are increasingly viewing their connection to the internet including theirgadgets as their lifeline Your patients keep their address book calendar and more ontheir mobile devices They rely on them Ensuring that your website is easilyaccessible and properly optimized for mobile devices just makes sense The trendtowards patients using their mobile devices to access information will only continueto grow In fact some sources claim that by 2015 nearly everyone will access theinternet from a mobile device With such a trend it makes sense to considerresponsive web design for your medical or dental website [21]

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 12: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

8

32323232 LiteratureLiteratureLiteratureLiterature SearchSearchSearchSearch

The following flow diagram show the literature review process

Figure 1 Articles Search Process

33333333 AnalysisAnalysisAnalysisAnalysis

331331331331 PublishingPublishingPublishingPublishing yearyearyearyearTable 1 Table for count of each publishing yearrsquos articlePublishingPublishingPublishingPublishing yearyearyearyear CountCountCountCount

2013 22012 62011 62010 6

2000-2010 0

The table above shows the count of reports in each publishing year The attention onresponsive web design rises from year 2010 when Ethan Marcotte put forward theconcept of RWD then it keeps the main trend and become to be popular as thenumber remain stable per year until to now

Springer database Google Scholar databaseKey words are divided into four categories(1) Topic ldquoresponsive web designrdquo(2) Technology ldquomedia-queryrdquo ldquoflexible gridrdquo(3) Programming Language ldquoNETrdquo ldquoHTML5rdquo ldquoCSS3rdquo(4) Device ldquohandheldrdquo ldquosmart-phonerdquoldquolaptoprdquo

179 articles were found (73 articles from Springerdatabase 106 articles were found from Google)

136 articles can find full text

43 articles discardedsince no full text found

71 articles were concerning about computer-basedtechnologies

20 articles were concerning about responsive webdesign

65 articles discardedsince no mention aboutcomputer technologies

51 articles discardedsince no met about

responsive web design

9

332332332332 PublishingPublishingPublishingPublishing countrycountrycountrycountryTable 2 Table for count of each countryrsquos article

PublishingPublishingPublishingPublishing countrycountrycountrycountry CountCountCountCountAustria 1Finland 2Germany 5Greece 1USA 4UK 3

Norway 1Italy 1

Sweden 2

From table above it indicates that Germany Smashing magazine put the mostefforts on responsive web design among all countries 5 related reports arepublished in Germany It can be seen that USA and UK also work hard on responsiveweb design with 4 and 3 research reports respectively The number of reports whichpublished in Europe and UK is 15 Especially Central European countries and Nordiccountries have made a major contribution to improve responsive web development 12published research papers However looking back to Asia no result are found in theresult set

33334444 QualitativeQualitativeQualitativeQualitative findingsfindingsfindingsfindings

With increasing Web users using handheld device to browse Web sites and apps Webdesigners and developers must make sure that their creations look good and workwell on mobile devices just like on traditional desktop computers

341341341341 TheTheTheThe developmentdevelopmentdevelopmentdevelopment ofofofof mobilemobilemobilemobile devicedevicedevicedevice marketmarketmarketmarketNowadays There is a large amount of site traffic comes from mobiledevicesmdashnamely smart phones and tablets(mainly the iPhone and iPad)mdashin additionto traditional personal computers Across the world mobile devices now account formore than 12 percent of Internet traffic in 2012 and this is increasing much fasterthan desktop computer and laptop Internet traffic In nations with high smart-phonepenetration the fraction of mobile Web traffic is sufficiently higher Whatrsquos more thisdata is expected to increase significantly over the next 10 years as smart-phonesdevelop and mature both in hardware and software and adoption which picks up inSouth America Asia and Africa[16]

Google company predicts that mobile devices will drive travel searches up by 15 -25 in 2013[17]

10

NASDAQ SCOR has reported that in the United State 51 of smart-phone ownersare using these handheld devices to access travel information[18]

Responsive Web Design has been cited as the No1 web design and developmenttrend for 2013 by the net magazine[19]

It is a real fact that the Smart-phone sales surpassed PC throughout the decade All ofthese are secondary in comparison to the fact that simple and clearly view in handhelddevice is needed to exist in the market of the future The figure 1 below shows thedevelopment of the mobile market

Figure 2 The Development Of Mobile Market[20]

From figure 1 we can draw the conclusion that mobile traffic is increasing incrediblyfast People check their email on mobile device first more and more people wouldlike to use high end and fast systemdevices(it is clear that the user of iPad and iPhoneoccupied the most proportion)

342342342342 SurveySurveySurveySurvey ofofofof thethethethe E-healthE-healthE-healthE-health useruseruseruserrsquorsquorsquorsquossss requirementrequirementrequirementrequirementPeople are increasingly viewing their connection to the internet including theirgadgets as their lifeline Your patients keep their address book calendar and more ontheir mobile devices They rely on them Ensuring that your website is easilyaccessible and properly optimized for mobile devices just makes sense The trendtowards patients using their mobile devices to access information will only continueto grow In fact some sources claim that by 2015 nearly everyone will access theinternet from a mobile device With such a trend it makes sense to considerresponsive web design for your medical or dental website [21]

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 13: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

9

332332332332 PublishingPublishingPublishingPublishing countrycountrycountrycountryTable 2 Table for count of each countryrsquos article

PublishingPublishingPublishingPublishing countrycountrycountrycountry CountCountCountCountAustria 1Finland 2Germany 5Greece 1USA 4UK 3

Norway 1Italy 1

Sweden 2

From table above it indicates that Germany Smashing magazine put the mostefforts on responsive web design among all countries 5 related reports arepublished in Germany It can be seen that USA and UK also work hard on responsiveweb design with 4 and 3 research reports respectively The number of reports whichpublished in Europe and UK is 15 Especially Central European countries and Nordiccountries have made a major contribution to improve responsive web development 12published research papers However looking back to Asia no result are found in theresult set

33334444 QualitativeQualitativeQualitativeQualitative findingsfindingsfindingsfindings

With increasing Web users using handheld device to browse Web sites and apps Webdesigners and developers must make sure that their creations look good and workwell on mobile devices just like on traditional desktop computers

341341341341 TheTheTheThe developmentdevelopmentdevelopmentdevelopment ofofofof mobilemobilemobilemobile devicedevicedevicedevice marketmarketmarketmarketNowadays There is a large amount of site traffic comes from mobiledevicesmdashnamely smart phones and tablets(mainly the iPhone and iPad)mdashin additionto traditional personal computers Across the world mobile devices now account formore than 12 percent of Internet traffic in 2012 and this is increasing much fasterthan desktop computer and laptop Internet traffic In nations with high smart-phonepenetration the fraction of mobile Web traffic is sufficiently higher Whatrsquos more thisdata is expected to increase significantly over the next 10 years as smart-phonesdevelop and mature both in hardware and software and adoption which picks up inSouth America Asia and Africa[16]

Google company predicts that mobile devices will drive travel searches up by 15 -25 in 2013[17]

10

NASDAQ SCOR has reported that in the United State 51 of smart-phone ownersare using these handheld devices to access travel information[18]

Responsive Web Design has been cited as the No1 web design and developmenttrend for 2013 by the net magazine[19]

It is a real fact that the Smart-phone sales surpassed PC throughout the decade All ofthese are secondary in comparison to the fact that simple and clearly view in handhelddevice is needed to exist in the market of the future The figure 1 below shows thedevelopment of the mobile market

Figure 2 The Development Of Mobile Market[20]

From figure 1 we can draw the conclusion that mobile traffic is increasing incrediblyfast People check their email on mobile device first more and more people wouldlike to use high end and fast systemdevices(it is clear that the user of iPad and iPhoneoccupied the most proportion)

342342342342 SurveySurveySurveySurvey ofofofof thethethethe E-healthE-healthE-healthE-health useruseruseruserrsquorsquorsquorsquossss requirementrequirementrequirementrequirementPeople are increasingly viewing their connection to the internet including theirgadgets as their lifeline Your patients keep their address book calendar and more ontheir mobile devices They rely on them Ensuring that your website is easilyaccessible and properly optimized for mobile devices just makes sense The trendtowards patients using their mobile devices to access information will only continueto grow In fact some sources claim that by 2015 nearly everyone will access theinternet from a mobile device With such a trend it makes sense to considerresponsive web design for your medical or dental website [21]

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 14: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

10

NASDAQ SCOR has reported that in the United State 51 of smart-phone ownersare using these handheld devices to access travel information[18]

Responsive Web Design has been cited as the No1 web design and developmenttrend for 2013 by the net magazine[19]

It is a real fact that the Smart-phone sales surpassed PC throughout the decade All ofthese are secondary in comparison to the fact that simple and clearly view in handhelddevice is needed to exist in the market of the future The figure 1 below shows thedevelopment of the mobile market

Figure 2 The Development Of Mobile Market[20]

From figure 1 we can draw the conclusion that mobile traffic is increasing incrediblyfast People check their email on mobile device first more and more people wouldlike to use high end and fast systemdevices(it is clear that the user of iPad and iPhoneoccupied the most proportion)

342342342342 SurveySurveySurveySurvey ofofofof thethethethe E-healthE-healthE-healthE-health useruseruseruserrsquorsquorsquorsquossss requirementrequirementrequirementrequirementPeople are increasingly viewing their connection to the internet including theirgadgets as their lifeline Your patients keep their address book calendar and more ontheir mobile devices They rely on them Ensuring that your website is easilyaccessible and properly optimized for mobile devices just makes sense The trendtowards patients using their mobile devices to access information will only continueto grow In fact some sources claim that by 2015 nearly everyone will access theinternet from a mobile device With such a trend it makes sense to considerresponsive web design for your medical or dental website [21]

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 15: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

11

As it is in our E-health model the patient prefer text in large font and input datawithout typing manually A simple and straightforward user interface design issignificant factor for the patient Furthermore specially for the diabetes patientrsquos inour application it can not only help user easier to learn how to use the website torecord their daily indicators but also delight the patients because they donrsquot needzoom the website surface to a proper size

343343343343 ResponsiveResponsiveResponsiveResponsive webwebwebweb designdesigndesigndesignIt is known to us that there are many well-known website organization have launcheddedicated website for iPhone or smart phone For example 3gqqcom mtaobaocomipadxxxcom and so on The question comes that is it necessary for us to designseparate website for each device Certainly it is very complex too many website foreach smart phone

In 2010 Ethan Marcotte wrote an introductory article about the Responsive WebDesign Responsive web design refers to the ability of a web page to respond andadapt to whatever device on which the page is being viewed It aimed at providing anoptimal viewing experience easy reading with the proper resizing panning andscrolling

There are Four principle methods to realize the responsive design when building awebsite the media query view-port fluid grids and flexible images These four arethe key point to realize the responsive web design

1111 MediaMediaMediaMedia queryqueryqueryqueryAs a web designer or front-end developer we all wish that our website can alwayseasily adapt the screen size of the device regardless of whether the user use the21-inch desktop 13-inch laptop or 10-inch iPad or smart phone To design aresponsive web we should use the media queries technique to change the layout ofthe page based on the width of browser and CSS Media query are a bits of CSS in aweb page that can inspect the physical characteristic(ie the width and height of thescreen in pixels ) of the device which request service

We added a few media queries to provide an improved experience on smaller screenslike those on a tablet or smart phone Instead of targeting specific device resolutionswe went with a relatively broad set of breakpoints based on each handheld resolutionsas it shown in the figure 3

Figure 3 Physical pixels on the screen for apple product[22]

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 16: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

12

Moreover we find that we use different breakpoints also depending on how we viewvarious devices for example portrait and landscape However some browser donrsquotsupport detecting orientation and motion events as it is shown in figure 4

Figure 4 The event of each browser for detecting orientation and motion[23]

Based on the figure3 we choose the most popular browser for apple product IOSSafari 60 and chrome 260 for our testing

Moreover there is another way worth mentioned regarding the responsive web designis that different CSS style sheet can be chosen based on the function characteristic ofthe request deviceltlink href=stylescss type=textcss media=screen rel=stylesheetgtltlink href=printcss type=textcss media=print rel=stylesheetgtThis is an old way which based on the media attribute with such references asmedia=rdquoscreenrdquo or media=rdquoprintrdquo But it canrsquot realize static responsive web design

The media queries allowing us to target styles based on a number of device attributesincluding screen width orientation resolution and so on Media queries allow us totarget not only certain devices and classes of devices but also allows us to actuallyinspect the physical characteristics of the device

2222 View-portView-portView-portView-portThe media query can already do a good job when we adjust the size of the browserbut it does not meet the mobile browserrsquo s requirement this is because the mobileclient browser(iPhoneiPadSafari AndroidChrome) will default the page is designedfor wide-screen so it will shrink the entire page to fit the small screen This indicatedthat just media query technology is inadequate to realize responsive web design thesolution is to combine the media query with Applersquos viewpoint mega tag in the headof the document

ltmeta name=viewport content=gt

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 17: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

13

There are two ways to type in the content ldquowidth=device-widthrdquo is available but itwill just meet the requirement when the device is portrait but when the device isrotated to landscape the screen will not responsive We use the second method whichset the content attribute value to ldquoinitial-scale=10 maximum-scale=10rdquo the settingof initial-scale=10 means that initializing the page without zooming the effect ofmaximum-scale=10 is to prevent the page zoom in rotation But it also brought amore serious problem preventing the user to manually zoom in or out on the page

3333 FluidFluidFluidFluid gridsgridsgridsgridsWhen design a responsive web Itrsquos your decision to choose between a fixed or fluidgrid to design the layout Throughout this tutorial we are going to focus on thedifference between fluid grids and fixed grids and our selection in responsive design

A fluid is a substance that continually deforms (flows) under an applied shearstress[24] generally web pages are made up of columns and rows Traditionally thisis always done with the use of fixed widths like width 20px Responsive web designmake the size of these pages relative to the screen size rather than a fixed widthWithout setting specific number of pixels wide the container is instructed to occupied25 percent of the width of the screen If different device request service from thewebsite the block will change relatively Fluid grid layout is constructed bypercentage instead of pixel Following is an example of fluid grid

div

width 90To determine the percentage of the fluid grid you have to calculate the proportionsfor each page element you must divide the target element by its context we cancalculate the extents for each page element with the formula given belowtarget context = result

It is easy to understand this formula with the example ldquobody font normal 100rdquoLet us assume that the font default width size to be 10px we can apply such font-sizeon the formula We have to divide the target value (20px) by the font-size of itscontainer (10px) 20divide10=2

So header h1 is two time of its default body font We can denote it by em then we canput into our CSS style sheet with ldquoh1font-size 2em rdquo(1em is equal to the currentfont size)

While fixed-width layout is constructed by specific pixel measurement This type oflayout is commonly used for web design Following is an example of fixed grid

div

width 900px

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 18: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

14

Fixed grid seems more intuitive to set the div width-size with practical value

When selecting which method to be used in our E-health model we take these twointo consideration after reading many articles and discussion we draw a conclusionbased on the E-health situation In reality from the conclusion we get above moreand more people would like to use high end and fast systemdevices( it is clear thatthe user of iPad and iPhone occupied the most proportion) so our E-health Websitewill mainly suitable for the mainstream handhelds such as iPhone and iPad usersWith this precondition four CSS style sheet are enough for our E-health websiteapplication There is no doubt that fluid grid works better than fixed grid but whenapplying fluid grid in the model some shortcomings come out for example whendesign a new web page we should first assign the whole layout of each module forevery handheld device and compute the relative percentage size of the component itwould take much time and energy on the overall design It is indeed that fluid griddisplay perfectly on most of the device but in some specific condition such as whenwe have already arranged an font size proportion and it will change relatively betweenthe scope from 0-300px it also display suitable for the device whose resolution is200px but not perfect because of the deforming image or font-size which will notmeet the userrsquos aesthetic feeling while fixed grids becomes more simple just settingthe practical value will be more convenient and it looks more intuitive Consideringall of these practical situation we combine the fixed grids with fluid grids methodtogether

4444 FlexibleFlexibleFlexibleFlexible imagesimagesimagesimagesWhen a grid scales in size then generally the images and text inside it also need toscale Originally if the actual width of the image is wider than the width of the devicethis will distract the container to slove this problem just the same as fluid gridsimages (or any content in a grid) are instructed to take up a certain percentage of pixelspace relative to the container they are in When the container changes the imagesinside change too Following is an example of flexible images the principle is sameas fluid grids and use the same formula to calculate the percentage too

image

width 30

35353535 RWDRWDRWDRWDGuidelineGuidelineGuidelineGuideline

To design a responsive web page we should use the technologies we have alreadymentioned above Following will be the detail guideline of how to use the responsiveweb design in a E-health application And we will also give a basic frameworkstructure of the responsive UI designing according to the different devices such as the

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 19: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

15

PC iPad and iPhone

1 In the structure no matter which type of the devices you use firstly we shouldinitialize the page without zooming when the devices is portrait or landscape as thefollowingltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt

2 Secondly for the different devices the media query has been used for its displayIn the structure four basic ranges for the device width has been defined as thefollowing Default wide-screen styles media all and (max-width 1024px)

styles for narrow desktop browsers and iPad landscape media all and (max-width 768px)

styles for narrower desktop browsers and iPad portrait media all and (max-width 480px)

styles for iPhoneAndroid landscape (and really narrow browser windows) media all and (max-width 320px)

styles for iPhoneAndroid portrait

Then for a screen resolution max width within 1024 pixels we present the page as thePC and iPad landscape originally designed For max width within 768px the page canget the styles for narrower desktop and iPad portrait For max width within 480px thepage can get the styles for mobile phone landscape And for max width within 320pxthe page can get the styles for mobile phone portrait

3 In the structure for different size devices with the same page four basic moduleswith the initial width and height have been defined And at the same time endue allthe style of each module with ldquofloatleft ldquostyle For the PC and iPad (no matterportrait or landscape) each module width will be pre-defined as 50 relative to thewidth of the screen

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 20: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

16

4 And for mobile phone (no matter portrait or landscape) considering the modulersquospresenting possible smaller if four modules arranged as the PC or iPad so eachmodule width will be pre-defined as 100 relative to the width of the screen asfollowing It will be more suitable for the mobile phone device with smaller screen

5 Once having the basic framework some development workload and time will besaved if a new application can directly and well use this framework In addition the

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 21: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

17

developer can do some proper modifications according the real requirements of aspecific application For example three modules can be arranged in one row and setthe corresponding width as the fluid grids method has been introduced

6 Lastly continuous testing and change the style of the element in CSS with propersize and location

33336666 ConclusionConclusionConclusionConclusion ofofofof RWDRWDRWDRWD

From all of the work we have down in the responsive web design we havesummarized up the conclusion and got some personal understanding of thistechnology Firstly Itrsquos worth bearing in mind that therersquos no simple solution tomaking sites responsible on mobile devices Liquid layouts are a great starting pointwe should combine all of the existing technology together rely on the actual conditionMedia queries and the other three are useful ways of adapting your websiteresponsively Secondly remember that there are also a certain number of browsersthat do not currently support the technique and there are some performanceimplications this is the main disadvantage of current responsive web designtechnology Thirdly when applying a responsive web design the key is to test earlyand test often on the handheld device with the Android SDK or iOS Simulator whenthe real devices are not available The last is that many current website have alreadyset the attributes of each element for a few years it would be a huge work to alter allthe component into a relative size it is worth researching in the future to design aresponsive browser which will automatically make the accessible website responsive

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 22: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

18

4444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacyInteroperability of E-health model system allows people store large amount ofinformation in different place In many of the developed countries healthcare hasevolved to a point where patients can have many different providersndash includingprimary care physicians specialists therapists and even alternative medicinepractitioners ndash to service their diverse medical needs There comes a big problem thatthe information sharing increase the risk of medical misuse and data theft TheE-health record may include the patient personal information like telephone numberage and so on even more the diabetes patientsrsquo glucose exercise information whichare private sometimes the patients just want to share their relative information totheir physician Data theft can invade to patients medical records and stole patientsrecords to do financial fraud In order to forbidden this crime how to keep the privacyand security becomes the key point in our project

41414141 IntroductionIntroductionIntroductionIntroduction

Privacy It means that the user can make the decessions by themselves when howand to what personal information is authorized to others [25]

Security It is designed that the personal information can be stored and transmitted ina proper manner limited to the authorized roles which well offers the protection of thedata integrity and availability etc[25]

Through the systematic literature review and internet searching we found that there isa set of national existing standards named HIPAA security rules(Health InsurancePortability and Accountability Act)[26] which is proposed by the US Department ofHealth and Human Services in 2005 to offer administrative technical and physicalstandards to ensure the security of protected health information (PHI) in the E-healthIT system Combining this rules some proper rulesrsquo modification will be done to besuitable for the E-health security framework in our project

42424242 PhysicalPhysicalPhysicalPhysical SafeguardsSafeguardsSafeguardsSafeguards

In this part it offers a reference measure to protect the hardware and facilities to thestored PHI And this is an quite important point for the pre-protection of the securityand privacy The detail considerings will be listed as the bellowing[27]

bull FacilityFacilityFacilityFacility accessaccessaccessaccess controlscontrolscontrolscontrols ndash The Limitations for physical equipments access tothe facilities where health information system is housed to ensure that theauthorized personnel are allowed to access the systembull WorkstationWorkstationWorkstationWorkstation useuseuseuse ndashSome specifications rules for the proper use ofworkstations and the characteristics of the physical environment of workstationsthat can access physical health information

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 23: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

19

bull WorkstationWorkstationWorkstationWorkstation securitysecuritysecuritysecurity ndash Restrictions on access to workstations with physicalhealth informationbull DeviceDeviceDeviceDevice andandandand MMMMediaediaediaedia CCCControlsontrolsontrolsontrols ndashIt means the receipt and removal of the deviceand media which will contain the physical E-health information into and out of thefacility for example disposal reuse of media accountability and data backup andstorage

43434343 TechnicalTechnicalTechnicalTechnical SafeguardsSafeguardsSafeguardsSafeguards

As it is defined in The Security Rule ldquoTechnical safeguards are safeguards that arebuilt into your health IT system to protect health information and to control access toitrdquo The technical safeguards contains many security rules such as measures to limitthe access the electronic information the way to encrypt and decrypt the electronicinformation and to make the information safe against unauthorized person to access[27]

bull AuditAuditAuditAudit controlscontrolscontrolscontrols - It contains recording and examining activity in health ITsystems Enables the user to generate the audit log entry with a particular timeperiod to sortbull IntegrityIntegrityIntegrityIntegrity - Protecting PHI from improper alteration or destruction includingimplementation of mechanisms to authenticate PHI such as Encryption for generalinformationbull PersonPersonPersonPerson orororor entityentityentityentity authenticationauthenticationauthenticationauthentication - Verifying that who is the person to accessthe physical health informationbull TransmissionTransmissionTransmissionTransmission securitysecuritysecuritysecurity - Protecting the information against unauthorizedperson to access to physical health information when the information istransmitted over an electronic communications network

44444444 SSSSecurityecurityecurityecurity andandandand privacyprivacyprivacyprivacy GuidelineGuidelineGuidelineGuideline

Based the above physical safeguards and technical safeguards a systematic guidelineabout the security and privacy will be designed and created in the framework as thebellowing441441441441 AccountAccountAccountAccount ManagementManagementManagementManagement1 Determine which individuals are authorized to work with electronic physical healthinformation in accordance with a role-based access approach in general there arethree basic roles in the framework which are users doctors and administrators2 Establish security training for all members who are involved in the creationtransmission and storage of e-PHI Ensure that training program includes periodicsecurity reminders and is updated to take into account current vulnerabilities andthreats3 To make sure that each account specified for unique users with correctly bounded4 To offer a proper way for the authorized usersrsquo access to any electronic physical

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 24: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

20

health information For the systems which need a strong electronic authentication likesufficiently complex password [25]5 Establish account maintenance procedures that make sure some terminated accountwill have no access control to the information6 The system administratorrsquos number should be carefully managed and kept theminimum number and provided only to personnel authorized to perform identifiedfunctions7 The Log activities will be monitored by system administrator logs on a regularbasis

442442442442 InformationInformationInformationInformation ManagementManagementManagementManagement1 Conduct the risk assessments to identify the electronic information resources andto understand the document risks from security failures that may cause loss ofconfidentiality integrity or availability The risk assessments should include analysisof situations which may led to modification of e-PHI by unauthorized sources [28]2 Select the appropriate mechanism to protect sensitive or critical relative data whichis determined by risk assessment

1)The e-PHI system need to be hardened against known operating systemvulnerabilities2)At some appropriate situations installing the firewalls and intrusion detectionsoftware to reduce threat form unauthorized resource3)Protect sensitive data with using appropriate strategies such as the use ofweb browser security standards virtual private networks and encryption4)Protect all devices against the malicious software like computer viruses Trojanhorses etc5)Run versions of operating system and application software with securitypatches and installed in a timely manner on networked devices

3 Implementation appropriate logical security measures such as encryption to protectdata from unauthorized access if the system or workstation including e-PHI can not behoused in a professionally managed in a secure location4 Implementing procedures to ensure periodic review of logs includinginconsistencies in the report5 Conduct back up of data and software on an fixed timetable Back up copies shouldbe stored in a physically separate location from the data source6 If it is possible terminate the electronic sessions after a period of inactivity

443443443443 DataDataDataData CentersCentersCentersCenters1The data center should be established in a safe place timely detection and preventionof emergency situations created by earthquake fire water leakage or flooding and soon2The physical access controls are needed in these secure locations such as lockselectronic key readers or other access control mechanisms[28]3Record all the facilities after the maintenance the equipment after modifying suchas hardware walls doors and locks

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 25: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

21

4Assign the appropriate person to record the hardware and software maintenanceafter equipmentrsquoremoval5Ensure backup of data before the moving of equipment

444444444444 InformationInformationInformationInformation forforforfor UsersUsersUsersUsers1You should use a complex password to access the information system thatcontaining the e-PHI the password is very secret so that others canrsquot get the it2All devices can install firewalls and intrusion detection software to protected againstmalicious software such as computer viruses Trojan horses spy-ware etc Thesedevices includes servers workstations Laptops tablets smart phones etc3Portable devices such as laptops if containing e-PHI the password should beprotected or encrypted since they cannot be physically secured4It is necessary for all devices which contain e-PHI be backed up on an establishedschedule5You must maintain the security of the information after removing electronic mediathat may contain e-PHI when you are planing dispose according to establishedprocedures This includes tape drives tapes portable hard drives and so on6 Encrypt electronic transmissions containing EPHI whenever deemed possible (likeemail containing e-PHI) If the encryption is not possible just considering email apublic document[28]

445445445445 OtherOtherOtherOther relatedrelatedrelatedrelated1 Establish procedures to ensure that electric protected health information can beaccessed if an emergency happens2 All confidential emails must be sent via secure channels3 Remind the patients the risks of unsecured emails4 All remote facility access into UC networks must be by secure methods forexample the authorized VPNs

45454545 GeneralGeneralGeneralGeneral LoginLoginLoginLogin andandandandAccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructure

451451451451 LoginLoginLoginLogin StructureStructureStructureStructure1 Allow the user to login with either his username or his e-mail address2 Allow the user to determine his own password3 Allow the user to login at once4 Offer a login form on access denied pages for the user who are not login5 Using two e-mail fields to ensure accuracy when registered6 The page will redirect to a specific page when the user login7 The page will redirect a specific page after the validation of userrsquos e-mail address8 A user message will be displayed when the user successfully login9 Provide a Public Key encryption for password and related information such ase-mali etc

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 26: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

22

452452452452AccessAccessAccessAccess ControlControlControlControl StructureStructureStructureStructureThere are many existing access control models can be used to meet the legalrequirement such as Role-Based Access Control (RBAC) Digital Right Management(DRM) Usage Control (UCON) Mandatory Access Control (MAC) According to thespecific E-health field a systematic comparison will be done to choose a propermodel and make appropriate adjustment to be suited to our frame

RBACRBACRBACRBAC A prospect succedaneum of traditional access control (Autonomic AccessControl Mandatory Access Control) In our model the authorities are directly relatedto roles When a user registered the user can set a role for himself when they becomea member of it users are assigned to corresponding role based on their responsibilityand qualification and the diabetes patients and physicians can access their relatedpage with specify role[29]

DRMDRMDRMDRM Pair of keys was generated including public key and private key The key pairis distributed by a third part called digital authorization center which is trusted byusers Public key is used to encrypt while private key is used to decrypt The messagecan be read only by the private key holder The key pair is generated by the recordcreator[30]

MACMACMACMAC In the MAC model the administrator manages the access control and designthe basic strategy And the other role such as user can not change the rules Once thestrategy is defined the object access authorization has been assigned to a fixedsubjectThough owning a higher security level this kind of access control model ispossible to cause some problems such as the flexible roles authority The other rolescan only follow the strategy the administrator made instead of flexible roleauthorization [31]

UCONUCONUCONUCON The UCON is made up by eight elements subject object and right objectattribute right authentications obligations conditions it is different with traditionalmodel which has not just subject object and right three elements The authority isbased on the attributions of subject and object and authority requirement Accessright can be assigned before or being the access actions Mutable attribute is the mostdifferent quality compared with other access control models Mutable attribute canchange along with the change of access result UCON model includes RBAC MACand DRM Itrsquos a new generation of accessing to control model[32]

Compared with all the access control models UCON is a more potential model forfuture design Itrsquos a new generation of access control model But A UCON basedsystem is more complex than others It not only costs more money but also spendsmore time to design and implement such a system The MACrsquos disadvantage is notflexible access rights are defined for different users this mechanism implies manyadministrative operations At the same time RBAC model is much easier to designthan UCON model It has the attributes of efficient security and flexibility in E-health

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 27: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

23

system Based on all the advantages and disadvantages of all the model andconsidering the specific characteristic of multiple-roles and user-oriented as thefollowing figure shows

Figure 5 The RBAC model[33]The RBAC is relative suitable for the E-health frame model In our frame the RBACmodel divides all the users into three basic parts Administrator user and doctorAccording the different requirement of each roles we set up the differentcorresponding permissions and actions in the basic frameThe following part willintroduce the different rolesrsquo authorities in detail

1)1)1)1) PatientPatientPatientPatientrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe patients need an E-health model which they can view their electric record and getself-care education moreover the patients need advice from specify doctors so theyhope that they can manage the access authority The patient need to have the right toassign some specific authorities for the doctors for example when a diabetes patientwant to share their medical record like glucose exercise weight vary and daily dietduring some periods sometimes they just want to share part of their informations likeglucose and they donrsquot want the doctor to see the othersrsquo privacy data When thepatients donrsquot want the doctor to access their medical record they can cancel thedoctorsrsquo authorities A authorities record history is needed to remind the patientswhom they has given the authorities to Search function is also needed in this systemthe patients can find the registered doctor as they want to give access control In ourE-health model the patient can view the record whenever they want and also sharetheir own thought with other patients in the communication platform

2)2)2)2) DoctorDoctorDoctorDoctorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsTo the doctor they would like the system to be flexible that they can also access thewebsite at anywhere and get the information from the patients who they give theauthority they also donrsquot want to view a handwritten record because of it will alwaysled some mistakes and wastes time which can reduce the medical accident causedby misunderstanding the doctors hope that they can share their experience and view

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 28: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

24

the patients record clearly

3)3)3)3)AdministratorAdministratorAdministratorAdministratorrsquorsquorsquorsquossss requirementsrequirementsrequirementsrequirementsThe E-health model need a administrator who can manage and monitor the websiteTo the administrator he would like to monitor the model in case of some criminalsstole and change the patient information for illegal purpose and also has the power tomanage the register users in our model the administrator can delete some illegalusers who always publish the advertisement in the forum and also can publish a globalnotification to all the users to remind some important things The administrator alsocan view all the information of the registered users except password

4)4)4)4) SecuritySecuritySecuritySecurity requirementsrequirementsrequirementsrequirementsTo avoid abusive registration all the users in this system can register only oneaccount for each person and we need also set the security mechanism for the userswhen they want to change the password or forget their password In our model theyneed to answer the security questions and give the email so that when he want tochange their password he needs to select the right security questions and answerswhen he registered and give the old password when he forgets his password he willreceive the original password from an official email in the mailbox when theyregistered Moreover it is general idea that only the person who knows the passwordcan login the account The password is encrypted during the transmission In thetransmission of medical records and personal information those information areencrypted

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 29: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

25

5555 StudyStudyStudyStudy onononon CloudCloudCloudCloud PlatformPlatformPlatformPlatform

51515151 IntroductionIntroductionIntroductionIntroduction

Cloud Platform is largely a combination of existing technologies which have alreadybeen around since the early 1990rsquos These technologies include grid computingutility computing and most recently virtualisation It is an emerging computingexample aimed at running the services over the internet flexibility and scalabilityWith the development of cloud platform The advantage has been shown outweigh thedisadvantage

Cloud computing is a framework that make convenient on-demand network access toa shared pool of configurable computing resources enable (for example networksservers storage applications services and so on ) which can be released with minimalmanagement effort or service provider interaction and rapidly supplied and published[34](Peter et al 2009)

Cloud is a combination of hardware and software which are being delivered throughServices There is three service models provided by cloud computing which offerdifferent levels of control and security These level are Infrastructure as a Service(IaaS) Platform as a Service (PaaS) and Software as a Service (SaaS) which are indecreasing order of control and increasing order of security[35]

Figure 6 Cloud service models related to security and user control[35]

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 30: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

26

52525252 CCCCloudloudloudloud bbbbenefitenefitenefitenefit

Cloud computing benefits can be categorized under Technical Users Quickdeployment aspects and they are listed as follows

521521521521 TechnicalTechnicalTechnicalTechnicalAdvantagesAdvantagesAdvantagesAdvantagesFollowing are the technical advantages of cloud computing [36](Weiss 2007)PowerPowerPowerPower ManagementManagementManagementManagement it is much easier to manage virtual server when compared withphysical serverScalabilityScalabilityScalabilityScalabilityIt is the one of the main positive aspects of cloud computing If peak loadand high traffic for a website happens cloud can handle easily without need of anyadditional hardwareDataDataDataData StorageStorageStorageStorage there are various kinds of data need to be stored all around the worldand it makes easy for any data to be deployed and to get fast and easy access withultimated data storageEfficiencyEfficiencyEfficiencyEfficiency andandandand reliabilityreliabilityreliabilityreliability Applications and website in cloud are so vital that theseare available and reliable for all services it makes the service efficiency andreliability with powerful computing capability and ultimated storage

522522522522 UserUserUserUserAdvantagesAdvantagesAdvantagesAdvantagesWhen considering users advantages cost reduction is the major advantage[36] (Weiss2007)CostCostCostCost ReductionReductionReductionReduction If peak load and high traffic happens most traditional computingneed additional hardware to fulfill the requirement while with the development ofcloud computing The consumer does not need to take much money on updating thesoftware and hardware as they can get the latest resources and services relatively inless time The consumers do not need to worry much about the configuration of thesystem storage capacity and capability because these will be handled by the cloudprovider

523523523523 QuickQuickQuickQuick deploymentdeploymentdeploymentdeploymentLastly and most importantly the cloud platform gives the advantage of quickdeployment once you select the method of the function the whole model will be builtin a few minutes certainly the amount of time taken will also base on the exacttechnology which you need for the business

53535353 CloudCloudCloudCloud limitationlimitationlimitationlimitation

In spite of its many benefits as mentioned above cloud platform also haslimitations Some limitations of the cloud computing are listed as following

531531531531 BandwidthBandwidthBandwidthBandwidth limitationlimitationlimitationlimitationTheres the very real issue of bandwidth limitation If you have any sizable data wait

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 31: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

27

for upload youre going to have big problems with upload speed Unless you havethe resources to afford a really big pipe to the Internet or it will take you a long time

532532532532 DataDataDataData securitysecuritysecuritysecurityNow from Sony to Google various corporations have at various times considering theproblem about their services being hacked and user data compromised For the usersif they upload the data on the cloud and is not at their own control so at mostsituation people donrsquot want to place their secret information into the cloud

533533533533 TheTheTheThe OfflineOfflineOfflineOffline cloudcloudcloudcloudAs we know the cloud computing is fully relying on the internet connection If thecustomer put all the data into the cloud when the internet connection problemhappens he is unable to access the application or the data

534534534534 ControlControlControlControlIt means when the application developer put all the data on the cloud platform itmeans he gives up control of all the data if the cloud provider is no longer profitableor go out of business you should address these considerations into the case for cloudcomputing when you plan to use them

55554444 CloudCloudCloudCloud PlatformPlatformPlatformPlatform selectionselectionselectionselection

According to the requirement and characteristic of the E-health field we choose thePaaS layer as the basic service model which has a relative complementary betweenthe control and security In this level the user has the ability to develop and deploythe custom applications to the cloud platform And now days there are three maincloud platform providers which are Microsoft Windows Azure (MWA) Google AppEngine (GAE) and GroundOS (GOS) in the PaaS level Among these platform MWAand GAE are the proprietary clouds whereas the GOS is an open source cloudThrough a systematic comparison with the providersrsquo general offerings and securityprotection some important aspects will be listed in detail as the following table

Table 3 Comparison of Three Popular Could Platform

GAEGAEGAEGAE MWAMWAMWAMWA GroundGroundGroundGround OSOSOSOS

AvailabilityAvailabilityAvailabilityAvailabilityNo SLA and no mentionof guaranteed uptime

Provided by SLA Problem of user

IntegrityIntegrityIntegrityIntegrityEncryption

AuthenticationEncryption

AuthenticationProblem of

User Encryption

ConfidentialityConfidentialityConfidentialityConfidentialityPrivacy policyEncryption

Authentication

Privacy policyEncryption

Authentication

Problem ofuser Encryption

AuthenticationAuthenticationAuthenticationAuthentication Single-sign onUsername amp

Username amppassword

Username amppassword

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 32: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

28

passwordSLASLASLASLA No Yes No

AutomatedAutomatedAutomatedAutomated FailFailFailFailoveroveroverover SystemSystemSystemSystem

Yes Yes No

PricePricePricePrice normal normal normalOperabilityOperabilityOperabilityOperability normal easy normal

AvailabilityAvailabilityAvailabilityAvailability It is usually guaranteed in the SLA ( Service-Level Agreement) And itis often considered as the uptime which is defined as how long the service could beavailable or online From investigating we found that MWA can realize an annualuptime of 9995 for computational operations And this percentage uptime level cantotally meet any type of business

IntegrityIntegrityIntegrityIntegrity ConfidentialityConfidentialityConfidentialityConfidentiality andandandand AuthenticationAuthenticationAuthenticationAuthentication The data stored in cloud platform isprotected by encryption and password authentication And it ensures that onlyauthorized users can be access to the data

SLASLASLASLA (((( Service-LevelService-LevelService-LevelService-Level Agreement)Agreement)Agreement)Agreement) It provides an agreement between the client andthe provide to guarantee the quality of service (QOS) with the measurable networkquality Once some system failures happen in the cloud platform and it can not meetthe agreement level of QOS the client could require some compensation from theprovider according the SLA So MWA well guaranteed the interests of the users

AutomatedAutomatedAutomatedAutomated Fail-overFail-overFail-overFail-over SystemSystemSystemSystem MWA provide the automated fail-over system and itallows the userrsquos data move to another data center when the current database sufferssome disaster of failure And it also provides regular backups mechanism for theusers

PricePricePricePrice The price is another considered issue for the client Among these three cloudproviders the MWA has a relative higher price but it is completely acceptable for theclient comparing with the high quality service provided by the vendor For examplethe bandwidth fee of the MWA has the free inbound and $012GB to $ 005GB out

OperabilityOperabilityOperabilityOperability Through comparison we found the MWA has a more easier operabilitywith a friendly interface The user can easily deploy and design the website anddatabase So it can help the new learner to grasp the method step by step quickly

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 33: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

29

6666 DesignDesignDesignDesign andandandand ImplementationImplementationImplementationImplementation

61616161 IntroductionIntroductionIntroductionIntroduction

In this part we will explain how to use the E-health frame above defined to develop ademo application about the diabetes self-care management web application to explainhow the model is to be implemented From the above introduction the RBAC modelin security and access control part MWA cloud platform selected as the deploymentplatform azure cloud database as the data storage and responsive web designtechnique used to realize automatical transferring from PC or tablet to handhelddevices with concise and comfortable view Then the rest part of this chapter willintroduce each step of the development process from the requirement analysis systemarchitecture design to the function module implement

62626262 SystemSystemSystemSystem descriptionampRequirementdescriptionampRequirementdescriptionampRequirementdescriptionampRequirement analysisanalysisanalysisanalysis

In the diabetes self-care management web application some basic modules whichcommon E-health field needed will be designed and implemented The mostimportant point and initial idea of the whole application aims to offer a platformwhere the user can realize self-care management and health self-education In additionthe application will include three different basic roles according to the RBAC modelintroduced in Chapter 4 For different roles the system developers set correspondingauthorities according the reality requirement Then some basic function modules willbe developed such as the Home page Introduction Forum page offering a platform tocommunicating and getting the adminrsquos global notifications and different rolesrsquofunction modules etc The next step is to apply the responsive web design techniqueto realize the proper view and layout transferring from the PC or tablet to handhelddevices automatically Then another important part about the diabetes patientsrsquo datacollecting and presentation will be involved in this system to offer a longtimerecording and checking for specific properties such as glucoses weight exercises anddiets etc Once referencing to the data storage the database selection and designingwill be considered Moreover the personal privacy and data security will be solved inthe system Lastly the whole will be deployed on the MWA web server to serve forthe user and make its sense The system function and modules designing will beintroduced in detail as the following

1 Self-careSelf-careSelf-careSelf-care educationeducationeducationeducation The application should offer a education tour platform wherethe user can obtain some basic information what they want for the diabetes such as thediabetes influence factors diabetes treatment diabetes types and nursing method etc

2 CommunicationCommunicationCommunicationCommunication platformplatformplatformplatform The application should offer a communicationplatform where different roles can share the resources what you have and get the

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 34: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

30

informations what they want In this part the user can create a subject and read theexisted content and the admin can publish the global notification to all the users

3 AuthoritiesAuthoritiesAuthoritiesAuthorities assigningassigningassigningassigning The application should offer different roles managementwhich are the user doctor and admin For different roles they will havecorresponding authorities

bull The user can login in its specific page to record and present its own dataMoreover the user can assign some specific permission to the other users or doctorswho they want to share the personal information with

bull The doctor also has its authorities that they can access the specific userrsquosinformation according to the awarded authorities

bullThe admin has the authority to view all the user and doctorrsquos information suchas the username e-mail except login password

4 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation Aiming at the userrsquos personal data theapplication should offer a easier method to record their personal data and offer aconcise presentation The presentation should include the query to different dataaccording to the record date time with different presentation format such ashistogram line chart and pie chart etc

5 ConciseConciseConciseConcise viewviewviewview Due to this application mainly serve for the diabetes and the majorcrowds of the diabetes patients are the older people So the application should has aconcise view both on the PC and handheld by responsive web design method Biggertext and more figure presentation will be preferred by the users

6 SecuritySecuritySecuritySecurity Itrsquos a quite important point for any user due to the privacy data existingNobody want its personal information exposed to the public So it requires theprotection measures such as access control and database selection and management

7 ReliabilityReliabilityReliabilityReliability The application will offer a longtime service for self-care educationand personal diabetes data storage and checking So the system should has a relativereliable performance So it references to the database and cloud platform selectionetc

63636363 InvestigationInvestigationInvestigationInvestigation andandandand previouspreviouspreviousprevious preparationpreparationpreparationpreparation

Aiming at this diabetes application a systematic survey has been done throughdifferent methods including meeting with related medical expert doctoral student ofthis specific field and internet search Firstly through investigation an initialunderstanding of diabetes has obtained Diabetes is the most main disease in thechronic and it needs a long period care and repetitive tests And the detail informationwill be introduced as the following

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 35: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

31

bull DiabetesDiabetesDiabetesDiabetes TypeTypeTypeType There are two kinds of diabetes one is Type 1 and the other isType2 For T1 it causes mainly due to the family history that there are familymembers having the T2 diabetes It has a high probability for the generations sufferedfrom the diabetes For T2 it usually happens due to the acquired factors

bull ParameterParameterParameterParameter Glucose is the most important and directly index to measure the extentof the diabetes For different types diabetes there will be different correspondingstandard values even different ages and gender with different standard

bull FactorsFactorsFactorsFactors There are many factors causing the diabetes except the inheritance such asthe physical exercise weight loss and diet etc

The above learning is an initial learning regarding the diabetes to help to quickly startthe application development And the specific work will be done by another groupwhich is responsible for the data collecting and research

64646464 SelectionSelectionSelectionSelection ofofofof operatingoperatingoperatingoperating systemssystemssystemssystems toolstoolstoolstools andandandand databasedatabasedatabasedatabase

641641641641Win7Win7Win7Win7 iosampAndroidiosampAndroidiosampAndroidiosampAndroid systemsystemsystemsystemThis application aims to be developed as a web-app and the reason why we choose theabove system as the application developed and applied system are present as follows

Win7 Now days Win 7 is the mainstream operating system all over the world And itspowerful performance can meet all kinds of requirements such as the common usersor business And it is usually used by the developer as a development environmentand moreover it has quite friendly interface

ios amp Android In smart phone market ios system and android system has occupied alarge part of the market share These two system has become the mainstreamoperating system for the smart phone and other handheld devices ( such as iPhone andiPad) So the web-applicationrsquos responsive web design will mainly focus on thesesystems

642642642642 HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5ampCSS30HTML5 HTML5 is the latest version of HTML or Hypertext Markup Languagewhyit has been chosen will be presented as follows[37]bull It loads much quicker than the older version because it equipped with theWebSocketsbullMore accessible on mobile phone applications when written in HTML5 because youneedrsquot write applications for a specific smart phone but create commonly usedapplications for all phonesbullMore flexibility in creating the websitebullIt is easy to and video audio and images modules and needrsquot any other third partysoftware

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 36: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

32

bullIt simply bases on HTML4 so the old version can well be used when developing thenew features in HTML5

CSS3 (Cascading Style Sheets)The presentation of website view can be realized withits flexibility and it makes content more prettier Since CSS3 is not supported by allthe browsers yet but it can not block its increasingly popular Comparing with tryingto obtain the same effect by using some plugin such as Java script or offering severaldifferent versions of the same image CSS3 seems much more easier to accomplishCombing the HTML5 with CSS3 together will help you to gain more measures for theresponsive web design technique

643643643643 PHPampASPNETPHPampASPNETPHPampASPNETPHPampASPNET

The requirements usually decide the choice of the technology The factors whichinfluence the decision of choice are listed as following[38]

1111 FeasibilityFeasibilityFeasibilityFeasibility PHP can be installed on any operating system and Web server otherthan ASPNET is only recommended for Windows IIS In our frame designing MWAcloud platform and windows cloud database have been chosen as prior chapterintroducing so considering the uniformity aspnet is more preferred in this specificapplication

2222 DevelopmentDevelopmentDevelopmentDevelopment costcostcostcost For the development cost both are same but aspnet morefocus on rapid-application-development and PHP is more on coding For the E-healthframe designing Rapid development will be more preferred

3333 ModeModeModeMode ofofofof sourcesourcesourcesource aspnet is the closed source and the PHP is the open source Butanyway application developers have not huge benefits for either it is closed or openThe developers just focus on how to use the tool to develop their application ratherthan whether the tool is closed or open source

4444 LanguagesLanguagesLanguagesLanguages For the aspnet it support much more language such as the C JavaScript etc rather than the PHP Aiming to the web-app much more language meansmore development methods

5555 SpeedSpeedSpeedSpeed Though investigation it found that PHP is recommended for small-to-medium projects and aspnet for medium-to-big applications Considering theexpanding of the application application in the future aspnet is more better

6666 SecuritySecuritySecuritySecurity aspnet PHP and its servers are mostly secure And the developers needto make sure their coding is secure In this way both are basically the same

7777 AdvancementAdvancementAdvancementAdvancement Constantly developing and integrating the new features will beinsisted by Microsoftrsquos team And it will take more time for PHP to reach the level

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 37: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

33

To sum up ASPNET has been chosen as the server side programming languageDevelopment toolsrsquouniformity speed and security are the main reasons why it hasbeen selected between the both

644644644644 CloudCloudCloudCloud databasedatabasedatabasedatabase ampampampampLocalLocalLocalLocal databasedatabasedatabasedatabase

Cloud Computing can be defined as a service or a platform or an operating systemover the Internet to perform tasks Database has become a part and parcel of life andis being used in almost every computer application As it is considered the most basicthing Cloud Computing also offers this database service There are two differentdatabase now available in our project which is Azure cloud database and MicrosoftSQL server database server Each of them has their own merits and demerits

AzureAzureAzureAzure ccccloudloudloudloud databasedatabasedatabasedatabase the Azure cloud database is typically running on Azure cloudcomputing platform There are two common deployment models the first way is thatusers can run databases on the cloud independently using a virtual machine while thesecond way is that they can also purchase access to a database service managed by acloud database provider [39]

LocalLocalLocalLocal SQLSQLSQLSQL serverserverserverserver databasedatabasedatabasedatabase Microsoft SQL Server is a relational databasemanagement system which is developed by Microsoft As a database it is a softwareproduct whose basic function is to store and retrieve data with requests by othersoftware applications Nowadays there are many different editions of SQL Serveraimed at different audiences and for different usages Its basic query languages areT-SQL and ANSI SQL[40]

In our project when we have already put the website on the cloud there are two waysavailable to store the data one is storing on the cloud and another is storing the data inlocal SQL server we take these two ways into comparison and get the result that theAzure cloud database is better because of four advantage parts the most importantpoint is that the access speed for the website request with the cloud database will bemore faster than the local database when the website has been published on the cloudplatform The second is that it will be flexible and reliable on the cloud platform thethird is that the customer will cost less but own a rapid computation capability andultimated storage The last reason is that we donrsquot need keep the local SQL serveronline all the day but the cloud platform will satisfy the demand at any place and anytime the user can access the website as they like In the E-health website the datastorage will be huge and the situation will also happen that too many users login in therecord it may led to the bottleneck Although it is also feasible with local SQL serverAzure Cloud SQL server appears much more outstanding

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 38: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

34

65656565 SystemSystemSystemSystemArchitectureArchitectureArchitectureArchitecture DesignDesignDesignDesign

Figure 7 BS architecture

The whole E-health application frame applies the BS (BrowserServer) architecturewhich the mainstream web architecture model The web browser is the mostimportant application of the client This model simplify the clientrsquos task and put thecore part of the system functions to the server to largely simplify the systemdevelopment maintenance and use Just install a Browser on the client such asInternet Explorer server install the database such as SQL server The browser datainteraction can be realized with the database through the web server This greatlysimplifies the client computer loads and reduce system maintenance and upgrade costand effortreducing the overall cost of ownership

BS structure of the biggest advantages is that you can doing some operating withoutinstalling any special software in any place as long as there is a computer withinternet access The client almost need none maintenance In case of aboveadvantages of the BS model the whole application will apply it as prior introducedthat the MWA IIS and database has been selected as the server and data storage

66666666 SystemSystemSystemSystem functionsfunctionsfunctionsfunctions andandandandModuleModuleModuleModule implementationimplementationimplementationimplementation

Based on the design frame defined in previous chapter a demo web-applicationaiming to the diabetes self-management will be developed to display how the modelcan be used into a specific applicationThe systemrsquos functions can be mainly dividedinto the below several categories Self-care education forum platform data collectingand presentation and security authority setting

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 39: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

35

661661661661 Self-careSelf-careSelf-careSelf-care managementmanagementmanagementmanagement

Figure 7 Self-care management pageThe above figures are the home page and tour page in the web-app on PC The homepage mainly offers a simple introduction and an initial idea of the diabetes and itsharm And the tour page mainly introduces the causing factors such as the exercisediet glucose etc and how to protect the diabetes Due to these two page just make arole of presentation of some information what needed to do is make the front-enddesign more proper and beautiful In order to make the page more diversification thevideo and google map modules have been add to the page and all the work has beendone in the front-end design

662662662662 CommunicationCommunicationCommunicationCommunication PlatformPlatformPlatformPlatform

Figure 8 Forum pageIn the forum page it offers a public communication platform for all the users sharing

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 40: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

36

the information and publish the topic they concern about In order to fulfill the pagetwo basic modules Grid-view and Detail view has been selected to use

1Grid-view Grid-view table are used for combining the corresponding data from thedatabase and organize with some format to present the information what the userscare about

2Text-box It is the basic components in web-application The user can put what theywant to publish in the text-box and the content can be store into the correspondingtable in the database through the back-end operation

3Buttons Once fulfilling the text the users can decide whether to send or cancelsending data to server by clicking the Submit button and Cancel button And someactions of the buttons will be done in the back-end programming

4Detail-view Detail-view table is used for view the userrsquos detail information ratherthan the grid-view Once the user want to view a detail information of a record fromthe grid-view it can be easily realized by clicking the Select link Certainlycorresponding data combining will be done

663663663663 datadatadatadata collectingcollectingcollectingcollecting andandandand presentationpresentationpresentationpresentation [41][41][41][41]

Figure 9 Record page

The above page present what information is needed to be recorded into the database

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 41: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

37

for the user Whatrsquos more through the Calendar module each record of the user canbe stored according to the date and now-time

Figure 10 Glucose data presentation page

The above figure illustrate userrsquos glucose data presentation The user can view eitherthe historical records or some specific records during some periods through selectingthe date form the start calender and end calender The other data presentation page areroughly the same as the glucose page

67676767 SecuritySecuritySecuritySecurity andandandand PrivacyPrivacyPrivacyPrivacy

671671671671 PasswordPasswordPasswordPassword SecuritySecuritySecuritySecurityDue to the web-app references to the personal data storage and presentation so thesecurity issue is an important point for the user Nobody wants privacy informationexposed to the public without any protection measures The following part willillustrate the implementation of the security rules introduced before

Figure 11 Register and Login in page

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 42: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

38

The above figures are the register and login interfaces When a new user surf thewebsite he needs register a new unique account for himself which can be used toidentify who is him when he surfs the site again later And the user should offer hise-mail address age and protecting answeretc some basic information which ispossible to be used in password setting and getting back pages Through passwordverification the userrsquos information can be well protected

Figure 12 Change password page

Figure 13 Forget password page

The above two figures are the password setting and forgotten page Through answer

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 43: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

39

the security question and fulfill the right now password registered before the user canrealize the password changing to improve the password security Whatrsquos more in thepassword forget page the user only needs to answer the security question andusername the password will be sent to the his personal e-mail box automatically

672672672672AuthorityAuthorityAuthorityAuthority managementmanagementmanagementmanagementThis is the model what has been discussed in previous chapter And in this section adetail process will illustrate how to apply the RBAC modelThe below three figuresare the user page doctor page and admin page

Figure 14 Permission page

Through setting three different roles according the RBAC rules the whole websitecan realize the access control and privacy security As you can see in the above figurethe user can access his own personal data collecting and presentation moreover hecan set some specific permissions for the specific user and doctor Only thoseauthority granted information such as glucose diet etc can be viewed by thespecified doctor It well protects the userrsquos privacy data and offer a better mechanismto give the permissions to the doctor and the other user

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 44: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

40

Figure 15 Doctor page

The above figure is the doctor page the doctor can view some specific information ofthe patient only when the user grants the permission Then the doctor can offer someprofessional advice and the other user having a relationship with the user can observeand take care of the patient

Figure 16 Admin page

The above figure is the administrator page In this page the admin has the permissionto view the user and doctorrsquos detail register information except the password It is a

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 45: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

41

good measure to protect the user information security without arbitrary changing Inaddition the admin also has the permission to delete a specific user or doctor once heconfirms the user is a malicious or false user Publishing a global notificationpermission is also granted to the admin to give some important notes in the forumplatform

To sum up the above illustration presents the basic applying process with the basicmodel and more security measures can be added in the future work

68686868 ResponsiveResponsiveResponsiveResponsiveWebWebWebWeb designdesigndesigndesign methodsmethodsmethodsmethods applicationapplicationapplicationapplication

The page displays differently to different devices following are the three differentviews when laptop iPad and iPhone visit the website

Figure 17 when the laptop visit the website

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 46: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

42

Figure 18 when the iPad visit the website

Figure 19 when the iPhone visit the website

We will give an example of our home page to introduce how to use the frameworkdefined before to realize the responsive web design1 Firstly we should change the header toltmeta name=viewportcontent=initial-scale=10 maximum-scale=10gt2 Secondly we put all the words and image in div container with HTMLprogramming language And enduing all the style of the div with ldquofloatleft ldquostyleIn the application four basic modules has been used But some modifications hasbeen done because the page will has more contents and information so more moduleshave been added into the structure according to the requirement Moreover set all the

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 47: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

43

element in the div container with flexible size or fixed size as following shows

It contain many images in the div container and give them initiate CSS style likewidth or height3 Thirdly with the help of the media query technology affording another CSS stylewhich has already set breakpoint of the scope for different device And enduringanther CSS style with the flexible and fixed technology like following shows

4 Lastly continuous testing and change the style of the element in CSS with propersize and location

69696969 EncounteredEncounteredEncounteredEncountered problemsproblemsproblemsproblems andandandand solutionssolutionssolutionssolutions

691691691691 HowHowHowHow totototo bindbindbindbind thethethethe datadatadatadata totototo thethethethe grid-viewgrid-viewgrid-viewgrid-view componentcomponentcomponentcomponent bybybyby back-endback-endback-endback-end operationoperationoperationoperationSolution The data source can be appointed through one SQL statement getting neededdata fields from the database When binding the data with the grid-view a problemhappens Since each data field from the SQL statement is a object and each grid-viewcan only bind a corresponding object so we create a class to realize the severalobjects encapsulation to a object with the constructor function

692692692692 ProblemProblemProblemProblem withwithwithwith IISIISIISIIS deploymentdeploymentdeploymentdeploymentWe have taken several days to initialize install the IIS and deploy the website on theIIS but one problem happens when we change the page name of the default page atfirst we set the name of homepage ldquodefault pagerdquo but when we change the name toldquohomepagerdquo the homepage of the website comes to be IIS directory page This isbecause the default document in IIS is setting to be Defaultaspx when we have

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 48: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

44

changed the name of the page the default attribution is not effective The solution iswe should modify the IIS default document properties resetting the inheritancerelationship

693693693693 DisplayDisplayDisplayDisplay problemproblemproblemproblem withwithwithwith thethethethe detail-viewdetail-viewdetail-viewdetail-view diagramdiagramdiagramdiagram andandandand linelinelineline chartchartchartchart componentcomponentcomponentcomponentAt first when trying to realize resizing the size of the detail-view diagram and linechart we found that it does not work by setting the corresponding size in differentmedia query style In order to solve this problem we have tried many ways such asmoving the components position and so on but all failed Through internet search inthe end we found it can only be solved through the CSS method ldquooverflow stylescrollrdquo the effect as the blew figure shows

Figure 29 The Solution Of scrolling

694694694694 LanguageLanguageLanguageLanguage problemproblemproblemproblem withwithwithwith thethethethe MSMSMSMS cloudcloudcloudcloud databasedatabasedatabasedatabase tabletabletabletable designdesigndesigndesignAfter we created the tables on the MS cloud database website canrsquot realize the correctconnecting with the cloud database We have tried many ways to solve the problemsuch as checking whether the connect-string and SQL statement is correct etc At lastthrough internet search we found when you create the database in the cloud at the firsttime the default language should be chosen And due to the system and versionproblem the language can only be chosen as the Latin instead of the English orChinese we previous selected

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 49: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

45

7777 SystemSystemSystemSystem TestTestTestTest andandandand EvaluationEvaluationEvaluationEvaluation

71717171 PerformancePerformancePerformancePerformance TestingTestingTestingTesting

Page loading time is an important part of providing a responsive user experience andextensive web research suggests that it correlates to how long users will stay on awebsite and how satisfied they are with the interaction It also directly determine thesearch engine ranking of this website[42]

Figure 30 Correlating page load time and user patience Most users will wait only 6to 10 seconds for a site to load [43]

Figure 3 shows the time users are willing to spend on waiting for a web page loadingAccording to surveys conducted by Akamai and Gomezcom there exist 40 percent ofusers will abandon the website if page load time exceeds three seconds And aone-second delay in page response can even reduce conversion by seven percent Themost serious event is that it would led to the economic losses for example ane-commerce site may making $100000 per day a one-second delay would cause $25million loss in annual sales [43]

As page load speed is very important we have to consider about how to improve thespeed the download speed of the network would be considered first according to astudy by PCWorld the average download speed for 3G networks in the US is 2 Mbpsand 62 Mbps for 4G networks A study by Ofcom found that the average downloadspeed for 3G in the UK to be 21 Mbps Outside of North America and Europeconnection speeds are generally slower Because 1 Mbps equals 122 KBs (or 012MBs) this translates into the following244 KBs on average for 3G users (024 MBs)

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 50: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

46

756 KBs on average for 4G users (076 MBs)[44]However download speed is not the bottleneck The bottleneck is the network latencywhen visiting a website only 20 of the time it takes to display a Web page comesfrom downloading files The rest of the time is spent processing HTTP requests andloading style sheets script files and images So will a responsive web design willimprove the speed of visiting website would it provide a better user experience andeven recoup their economic losses

We separately test our two websites with responsive and no responsive technologywith the chrome browser When testing the speed of these two website we use thepage speed tool comes from google and wwwwebpagetestorg these two tools arevery useful which would generate the report of testing With the help of these reportwe can directly recognize the advantage of responsive web design The figure shownbelow give the detail report of using the same device to detect the website which arewith and without responsive web design The detail report of waterfall view are addedin Enclosure 2

Figure31 The connection view without using the responsive web design

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 51: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

47

Figure32 The connection view with using the responsive web design

Figure33 The figure show the detail speed of visiting the responsive web

Figure34 The figure show the detail speed of visiting the no responsive web

Result from google page speed toolThe page default got an overall Page Speed Score of 88 (out of 100) (responsivepage)The page default got an overall Page Speed Score of 83 (out of 100) (no responsivepage)

From the figure shown above we can draw the conclusion that the user can get morefaster and simper experience with the responsive website since it is 2 times fasterwhich is 2018s while the non-responsive website get the page load speed of 5349sSpeed is a core feature in website creation responsive web design not only meet thecustomerrsquos requirement and also help the web provider restore the loss

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 52: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

48

72727272 BlackBlackBlackBlack BoxBoxBoxBox testingtestingtestingtesting

Black box testing is applied during the development of project work Black boxtesting is primarily used for testing the functionality of the systemWebsite function black box testing

Table 4 Table for website function black box testingTestTestTestTest numbernumbernumbernumber DescriptionDescriptionDescriptionDescription ExpectedExpectedExpectedExpected outcomeoutcomeoutcomeoutcome PassPassPassPass

FailFailFailFail

1

Register a user with all theinformation fulfilled1)Input all the informationin the text box and scrollall Seekbars to a certainvalue2)press the submit button

A successful messageshows on the screenindicates registersuccessfully

Pass

2

Register a user without allthe information fulfilled1)Input the information inone text box2)press the submit button

An error message shouldpop up on the screen thatindicates registering dataunsuccessfully

Pass

3 Register a user with thepassword less than 7 byte

An error message shouldpop up on the screen thatindicates minimumpassword should be 7

Pass

4

Change the password withthe security answered thesame when the userregistered

A successful messageshows on the screenindicates change thepassword successfully

Pass

5

Change the password withthe security answered notthe same when the userregistered

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

6

Change the password withthe old password not thesame when the userregistered

An error message shouldpop up on the screen thatindicates the old passwordis not correct

Pass

7Cancel the data fields1) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 53: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

49

8

Cancel the data fields1) Input the data in one ofthe data field or scroll oneSeekbar2) Click cancel button

Seekbarrsquos and EditTextrsquosvalues need reset to defaultvalues

Pass

9

Forget the password withchoosing the correctsecurity question andtyping the security answercorrectly

An email with old passwordwill be sent from theofficial E-health email

Pass

10Forget the password withchoosing the wrongsecurity question

An error message shouldpop up on the screen thatindicates the securityquestion is not correct

Pass

11Forget the password withtyping the security answerwrongly

An error message shouldpop up on the screen thatindicates the securityanswer is not correct

Pass

12Plot data1) type in all theinformation and submitted

The glucose chart exercisechart weight chart and dietgrid-view will displaycorrectly

Pass

13

Zooming in and out1) Visiting the websitewith iPhone and iPad2) Turn the device indifferent orientation

The website will displaywell whether the iPhone oriPad visits and whether it isportrait or landscape

Pass

14

Search the doctor and givethe specified doctorauthority to access thepatients specified items

The authenticated doctorwill view the specific itemsof the patient

Pass

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 54: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

50

8888 ConclusionConclusionConclusionConclusionThe main purpose of the report is to establish a general E-health web applicationframework including the cloud platform selecting security mechanisms defining andthe usage of the responsive web design technique Through the systematic comparisonthe MWA cloud platform and ASPNet HTML5 CSS3 has been chosen as the maintools due to the well compatibility and operability In addition a general securityguideline common login structure and RBAC access control structure has been givento protect the personal information Moreover four main methods used to realize theresponsive web design have been introduced in the report And a responsive webframework has been designed to offer a basic referenced model for the future specificapplication Finally a prototype web application based on the general framework hasbeen designed and implemented Through testing it proved that the responsive webpage loads more faster than the non-responsive web page

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 55: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

51

9999 FutureFutureFutureFutureWorkWorkWorkWorkSince the framework and a prototype have been done in the project with in limitedtime there are some ways that we thought can be further improved and implementedin the future work

First of all personal data storage will be a main risk for privacy security especiallythe password encryption in the cloud database Some kinds of encryption measuressuch as RSA and DES etc can be applied to improve the data security level Inaddition communication between client and server needs encryption for avoiding thesniffing

Secondly this prototype just a simple application to show how the framework isapplied so the responsive web design mainly aims to the mainstream handheld device( iPhone and iPad ) in the market Some other type system of the mobile such as theAndroid will be added to well-adapt In addition the mobile UI will be furtherimproved to be more proper and comfortable according the designing peopleacceptable standard

Thirdly considering the inconvenience in remembering many website username andpassword the account combining with some existed account of website and softwaresuch as MSN Facebook etc is necessary It will reduce the userrsquos burden

Lastly since the MS cloud database has been selected as the development part of themodel so the data transfer will be further researched and implemented in case theowner of the website want to change the database vender Huge amount of datatransfer will be a big problem in the future if this situation will happen

The purpose of all these works aims to provide user a pleasuring experience and greatuser interaction Technology changes the life so learning new technique constantly isquite necessary and important

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 56: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

52

10101010 ReferencesReferencesReferencesReferences[1] (2013-May-9th)httpenwikipediaorgwikiSmartphone[2] (2013-May-9th)httpenwikipediaorgwikiICT[3] (2013-May-9th)httpenwikipediaorgwikiResponsive_web_design[4] (2013-May-9th)httpenwikipediaorgwikiEHealth[5] BSDIS University of Chicago ldquoWeb Hosting Service Level Agreement (SLA)terms and conditionrdquo August 2007[6] Kondwani Nampanda (2012) Identifying Best Practices for Security in PatientHealth Information Systems (E-health Solutions) in Resource Limited Setting MalawiCase on Establishment of National Health Data Repository Centre 7-9[7] Mitchell J (1999) Tele health to e-health The unstoppable rise of e-healthCanberra Australia commonwealth Department of Communications InformationTechnology and the Arts (DOCITA)[8]BJFogg MarshallJ LarakiO OsipovichA VarmaC FangN PaulJRangnekarA ShonJ SwaniP TreinenM (2001) What Makes Web Sites CredibleProceedings of ACM CHI 2001 Conference on Human Factors in Computing Systems2001[9]Haumlyrinen K SarantoK amp Nykaumlnen P (2008) Definition structure content useand impacts of electronic health records A review of the research literatureInternational Journal of Medical Informatics 77(5)291ndash304[10]Grogan J (2006) EHRs and information availability are you at risk Healthmanagement technology 27(5)16[11]John W H amp Phillip P (2009) The national healthcare crisis Is ehealth a keysolution Business Horizons 52(3)265ndash27[12]Hill J W Langvardt A W amp Massey AP (2007) Law informationtechnology and medical errors Toward a national healthcare information networkapproach to improving patient care and reducing malpractice costs U Ill JL Tech ampPolrsquoy[13]Mearian L (October 2010) Digital divide plagues slow e-health records rolloutRetrieved fromhttpwwwcomputerworldcomsarticle9193130Digital_divide_plagues_slow_e_health_records_rollout[14]e-Health in Europe Ingenico Corporate Communication and Thierry SpanjaardSmart Insights (June 2012)Retrieved fromhttpwwwingenicocomru4fefpdft=documentManagersfdocfilesupplyampfileID=1341391556104[15]Lorenzo Valeri Daan Giesen(2010) Patrick Jansenb Koen EnklokgietersBusiness Models for eHealthRetrieved fromhttpwwwmyesrorghtmlimgpoolbusiness_models_eHealth_reportpdf[16]httpwwwsitepointcomwhy-the-web-is-ready-for-responsive-web-design

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 57: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

53

[17](2013-May-10th)httpwwwthinkwithgooglecominsightslibrarystudiesthe-2012-traveler[18](2013-May-9th)httpbarbadosorgdocumentsbarbados-responsive-web-designpdf[19](2013-May-9th)httpwwwnetmagazinecomfeatures20-top-webdesign-and-development-trends-2013[20](2013-May-9th)httpreadwritecom2013041610-developer-tips-to-build-a-responsive-website-infographic[21](2013-May-10th)httpnewpatientsinternetmarketingcomemerging-trends-responsive-web-design[22](2013-May-10th)httpenwikipediaorgwikiList of displays by pixel density[23](2013-May-10th)httpcaniusecomsearch=orientation[24](2013-May-10th)httpenwikipediaorgwikiFluid[25](2013-May-10th)httpwwwcredenticacomehealthpdf[26](2013-May-10th)httpwwwhrsagovhealthittoolboxHealthITAdoptiontoolboxPrivacyandSecurityhipaaruleshtml[27](2013-May-10th)httpwwwhrsagovhealthittoolboxHIVAIDSCaretoolboxSecurityAndPrivacyIssueshowdoiensuresechtml][28](2013-May-10th)httplibraryahimaorgxpediogroupspublicdocumentsahimabok1_048622hcspdDocName=bok1_048622[29](2013-May-10th) httpsenwikipediaorgwikiRBAC[30] DRM options for downloads of books on Google Play Google March 6 2013Retrieved 2013-29-04[31] P A Loscocco S D Smalley P A Muckelbauer R C Taylor S J Turner andJ F Farrell The Inevitability of Failure The Flawed Assumption of Security inModern Computing Environments In Proceedings of the 21st National InformationSystems Security Conference pages 303ndash314 Oct 1998[32] PENG Ling-xi YANG Pin PENG Yin-qiao SUN Fei-xian ZENG Jin-quan LIUCai-ming(2007) Survey of usage access control model School of InformationGuangdong Ocean University[33](2013-May-11th)httptechnetmicrosoftcompt-ptlibrarycc780256(v=ws10)aspx[34] Peter M amp Tim G (10 July 2009) The NIST definition of Cloud ComputingVersion 15Information Technology Laboratory Retrieved fromhttpwwwhexistorcomblogbid36511The-NIST-Definition-of-Cloud-Computing[35] Byron Ludwig ampSerena Coetzee A Comparison of platform as a service (PAAS)clouds with a detailed reference to security and geo-processing serviceDepartment ofComputer Science University or Pretoria Pretoria[36]Weiss A (Dec 2007) Computing in the Clouds Networker vol 11 no 4 p18[37](2013-May-12th)httpwebdesignledgercomtipshtml5-css3-take-your-design-to-another-level[38](2013-May-12th)httpwwwcodeprojectcomArticles102854PHP-and-ASP-NET-A-Feature-List

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 58: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

54

[39](2013-May-12th)httpenwikipediaorgwikiCloud_database[40](2013-May-12th)httpenwikipediaorgwikiMicrosoft_SQL_Server[41]QunYing Song JingJing Xu(2013) Study and Implementation of Patient DataCollection and Presentation for an eHealth Application Kristianstad University[42]Brett S Gardner Responsive Web Design Enriching the User Experience Noblis[43](2013-May-12th)httpblogkissmetricscomloading-time[44]Johan Johansson(2013) How To Make Your Websites Faster On Mobile DevicesSmashing magazine

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 59: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

55

11111111 EnclosuresEnclosuresEnclosuresEnclosures

EnclosureEnclosureEnclosureEnclosure 1111ArticlesArticlesArticlesArticles forforforfor literatureliteratureliteratureliterature reviewreviewreviewreview

[1]Ethan Marcotte (2010) Business Models for eHealthRetrieved fromhttpwwwprincetonedu~mlovettreferenceA20List20Apart-Articles-Responsive20Web20Designpdf[2]Robert Godwin-Jones(2011) Emerging Technologies mobile apps for languagelearning Language Learning amp Technology Volume 15 Number 2 pp 2ndash11[3]Ethan Marcotte (2011) 20 favourite responsive sites net magazine[4]Gillenwater Zoe Mickley(2010) Examples of flexible layouts with CSS3 mediaqueries Stunning CSS3 p 320 ISBN 978-0-321-722133[5] Hannemann Anselm(2012) The road to responsive images net Magazine[6] Jacobs Denise (2011) 21 top tools for responsive web design net Magazine[7]Firtman Maximiliano(2010) Programming the Mobile Web p 512 ISBN978-0-596-80778-8[8]Snyder Matthew Koren Etai (2012) The state of responsive advertising thepublishers perspective net Magazine[9]Young James(2012) Top responsive web design problems testing net Magazine[10]Marcotte Ethan (2011) Responsive Web Design ISBN 978-0-9844425-7-7[11]Mike Perkowitz Oren Etzioni[2010] Towards Adaptive Web Sites ConceptualFramework and Case StudyRetrieved fromhttphomescswashingtonedu~etzionipapersperkowitz_www8pdf[12]Ronan Cremin and Luca Passani(2010) Mobile Web Standards Reference GuideUCONN universityRetrieved fromhttpwebtoolsuconnedustandardsmobile_web_standards-2013pdf[13]Ronan Cremin and Luca Passani(2012) Server-Side Device Detection HistoryBenefits And How-To Smashing magazine[14]Thierry Koblentz(2012) Device-Agnostic Approach To Responsive Web DesignSmashing magazine[15]Smashing Editorial(2011) Responsive Web Design Techniques Tools and DesignStrategies Smashing magazine[16]Jon Raasch(2010)How To Build A Mobile Website Smashing magazine[17]Bruce Lawson(2012)Why We Shouldnt Make Separate Mobile WebsitesSmashing magazine[18]Bruce Lawson(2011) Notes on Designing Websites for the Asian MarketRetrieved fromhttpwwwsitepointcomnotes-on-designing-websites-for-the-asian-market[19]Kayla Knight(2013) Responsive Web Design What It Is and How To Use ItSmashing magazine

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 60: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

56

[20] Dino Esposito(2013) Responsive Web Design A Device-Oriented Salvation DrDobbrsquos Journal

EnclosureEnclosureEnclosureEnclosure 2222 ReportReportReportReport forforforfor responsiveresponsiveresponsiveresponsive webwebwebweb loadloadloadload speedspeedspeedspeed simulationsimulationsimulationsimulation

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 61: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

57

EnclosureEnclosureEnclosureEnclosure 3333AbbreviationsAbbreviationsAbbreviationsAbbreviations

AASP Active Server Pages

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 62: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

58

BBS BrowserServer

CCSS Cascading Style SheetsCS ClientServer

DDRM Digital Right Management

EE-health Electric Health RecordEU Europe Union

GGAE Google App EngineGOS Ground Operating System

HHTML5 Hypertext Markup LanguageHKR Houmlgskolan KristianstadHIPAA Health Insurance Portability and Accountability Act

IIaaS Infrastructure as a ServiceICT Information and Communication TechnologyIIS Internet Information ServicesIT Information Technology

JJS Java Script

MMAC Mandatory Access ControlMWA Microsoft Windows Azure

NNASDAQ National Association of Securities Dealers Automated Quotations

OOOP Object-oriented programming

PPaaS Platform as a Service

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 63: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

59

PHIProtected Health Information

QQOS Quality Of Service

RRBAC Role-Based Access ControlRWD Responsive Web Design

SSaaS Software as a ServiceSLA Service-level AgreementSOAP Simple Object Access ProtocolSQL Structured Query Language

UUCON Usage ControlUI User interface

EnclosureEnclosureEnclosureEnclosure 4444 MeetingMeetingMeetingMeeting InvestigationInvestigationInvestigationInvestigation

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation
Page 64: Master Thesis - diva-portal.org647835/fulltext01.pdf · Master Thesis Spring 201 3 School of Health and Society Department Design and Computer Science Writer Jun Lu Song Zhang Instructor

60

  • 1Introduction
    • 11Background
    • 12Aimandpurpose
    • 13Reportorganization
    • 14Acknowledgement
      • 2StudyonE-health
        • 21Introduction
        • 22AdvantagesofE-health
        • 23BarrierstoE-Health
        • 24E-HealthinEU
        • 25E-healthRequirement
          • 3LiteratureReviewonResponsiveWebDesignand
            • 31MethodsandResources
            • 32LiteratureSearch
            • 33Analysis
            • 34Qualitativefindings
            • 35RWDGuideline
            • 36ConclusionofRWD
              • 4Securityandprivacy
                • 41Introduction
                • 42PhysicalSafeguards
                • 43TechnicalSafeguards
                • 44SecurityandprivacyGuideline
                • 45GeneralLoginandAccessControlStructure
                  • 5StudyonCloudPlatform
                    • 51Introduction
                    • 52Cloudbenefit
                    • 53Cloudlimitation
                    • 54CloudPlatformselection
                      • 6DesignandImplementation
                        • 61Introduction
                        • 62SystemdescriptionampRequirementanalysis
                        • 63Investigationand
                        • 64Selectionofoperatingsystemstoolsanddat
                        • 65SystemArchitectureDesign
                        • 66SystemfunctionsandModuleimplementation
                        • 67SecurityandPrivacy
                        • 68ResponsiveWebdesignmethodsapplication
                        • 69Encounteredproblemsandsolutions
                          • 7SystemTestandEvaluation
                            • 71PerformanceTesting
                            • 72BlackBoxtesting
                              • 8Conclusion
                              • 9FutureWork
                              • 10References
                              • 11Enclosures
                                • Enclosure1Articlesforliteraturereview
                                • Enclosure2Reportforresponsivewebloadspeeds
                                • Enclosure3Abbreviations
                                • Enclosure4MeetingInvestigation