Web Engineering


Published on

Web Engineering

Published in: Technology
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Web Engineering

  1. 1. WEB ENGINEERING Deniz KILINÇ [email_address]
  2. 2. What is it? <ul><li>Web Engineering is the process used to create high-quality WebApps. </li></ul><ul><li>Web Engineering is not a perfect clone of software engineering. </li></ul><ul><li>It borrows many of software engineering’s fundamental concepts and principles. </li></ul>
  3. 3. What are the steps? <ul><li>Problem is formulated </li></ul><ul><li>Project is planned </li></ul><ul><li>Requirements of the WebApp are analyzed. </li></ul><ul><li>Architectural, navigational and interface design are conducted. </li></ul><ul><li>The system is implemented using specialized languages. </li></ul><ul><li>Tested. </li></ul>
  4. 4. The attributes of Web-Based Applications <ul><li>Network Intensive; Resides on a network(Internet, Intranet, Extranet) and must serve the needs of a diverse community of clients. </li></ul><ul><li>Content Driven; Primary function of a WebApp is to use hypermedia to present text, grphics, audio and video content to the end-user. </li></ul><ul><li>Continuous Evolution; Unlike convetional application software, Web Applications evolve continuously. </li></ul>
  5. 5. The characteristics of Web-Based Applications(I) <ul><li>Immediacy; Developers must use methods for planning, analysis, design, implementation and testing that have been adapted to the compressed time schedules required for WebApp development. </li></ul><ul><li>Security; Because WebApps are available via network access, it is difficult to limit the population of the end-users who may access the application. Strong security measures must be implemented throughout the infrastructure that supports WebApp like SSL. </li></ul>
  6. 6. The characteristics of Web-Based Applications(II) <ul><li>Aesthetics; Undeniable part of WebApp is its look and feel. When an application is designed to market or sell products aesthetics becomes much more important. </li></ul><ul><li>General characteristics apply to all WebApps with different degrees </li></ul>
  7. 7. Web Application Quality <ul><li>Usability; Understandability,Aesthetic </li></ul><ul><li>Functionality; Searching, Navigation, Browsing </li></ul><ul><li>Reliability; Correct Link, Error Recovery, Input Validation </li></ul><ul><li>Efficiency; Response Time Performance, Page and Graphic Generation Speed </li></ul><ul><li>Maintainability; Extensibility </li></ul>
  8. 8. The technologies <ul><li>Component Based Development; Three major infrastructure standards are available for Web engineers:CORBA,COM/DCOM, and Java Beans. </li></ul><ul><li>Security; A variety of security measures are provided by the network infrastructure, encryption techniques, firewalls and other measures. </li></ul><ul><li>Internet Standards; HTML enables the developer to provide a series tags that describe the appearance of objects(text, graphics, audio/video, forms...).A new standard, XML has been developed. </li></ul>
  9. 9. Framework For WebE Content Design Production Architectural Design Navigation Design Interface Design Formulation Planning Analysis Customer Evulation Page Gen. & Testing
  10. 10. Formulation(I) <ul><li>Allows the customer and developer to establish a Goals and Objectives for the construction of WebApp. </li></ul><ul><li>Identifies the scope of the development effort. </li></ul><ul><li>Questions at the beginning of the formulation step; </li></ul><ul><ul><ul><li>What is the main motivation for the WebApp? </li></ul></ul></ul><ul><ul><ul><li>Why is the WebApp is needed? </li></ul></ul></ul><ul><ul><ul><li>Who will use the WebApp? </li></ul></ul></ul>
  11. 11. Formulation(II) <ul><li>Example; Manufacturer of home Security System decided to establish e-commerce Web Site. </li></ul><ul><ul><li>Answer1: Site will allow customers to purchase compenents for home/bussiness security. </li></ul></ul><ul><ul><li>Answer2: Eliminate retailer cost. Increases sales %25 percent. </li></ul></ul><ul><ul><li>Answer3: Homeowners and Owner of small bussiness. </li></ul></ul><ul><li>These answers imply specific goals. Two categories of goals; </li></ul><ul><ul><li>Informational Goals: Provides content information. </li></ul></ul><ul><ul><li>Applicative Goals: Ability to perform some task like selling and buying. </li></ul></ul>
  12. 12. Analysis <ul><li>Technical activity that identifies data,functional requirement for the WebApp. </li></ul><ul><li>Four types of anaylsis exists for WebE. </li></ul><ul><ul><li>Content Analysis; Content to be provided is identified. Content includes text,graphics,image,video and audio data. </li></ul></ul><ul><ul><li>Interaction Analysis; The manner in which the user interacts with the WebApp is described in detail. </li></ul></ul><ul><ul><li>Functional Analysis; All operations and functions are described.(Search...) </li></ul></ul><ul><ul><li>Configuration Analysis; The environment and infrastructure in which WebApp resides are described in detail. </li></ul></ul>
  13. 13. Design <ul><li>Problem : Must establish a design that solves the immediate bussiness problem while at the same time defining application architecture that has the ability to evolve rapidly over time. </li></ul><ul><li>Three design types focuses; </li></ul><ul><ul><li>Architectural Design </li></ul></ul><ul><ul><li>Navigation Design </li></ul></ul><ul><ul><li>Interface Design </li></ul></ul>
  14. 14. Architectural Design <ul><li>Focuses on the </li></ul><ul><ul><li>Definition of hypermedia structure </li></ul></ul><ul><ul><li>Design patterns </li></ul></ul><ul><ul><li>Constructive templates </li></ul></ul>
  15. 15. HyperMedia Structures(I) <ul><li>Depends on goals established , the content to be presented , the users who will visit . </li></ul><ul><ul><li>Linear Structures; Predictable sequence of interactions. </li></ul></ul><ul><li>Tutorial presentation in which pages of information along with related graphics are generally presented one by one. </li></ul><ul><li>Product order entry sequence in which specific infromation must be entered in specific order. </li></ul>
  16. 16. HyperMedia Structures(II) <ul><ul><li>2. Grid Structures; Applied when content orginized categorically in two or more dimensions. </li></ul></ul><ul><li>E-commerce site sells golf club.Horizontal dimension of of grid represents the type of club(woods,irons...).Vertical dimension represents offerings provided by various golf club manifacturers. </li></ul><ul><li>Architecture is useful when the content is regular. </li></ul>
  17. 17. HyperMedia Structures(III) <ul><ul><li>3. Hierarchical Structures; Allows rapid navigation. But it can lead to confusion for user. </li></ul></ul>
  18. 18. HyperMedia Structures(IV) <ul><ul><li>4. Networked Structures; Similar to object-oriented architecture. Each component(web page) is connected to every other component.Has navigation flexibility but can be confusing to user. </li></ul></ul>
  19. 19. Navigation Design(I) <ul><li>Designer must define navigation pathways that enable a user to access WebApp content. </li></ul><ul><li>WebApp have different roles : Visitor, registered, privileged. </li></ul><ul><li>Each of these roles associated with different levels of content access. </li></ul><ul><li>SNU(Semantic Navigation Unit) : for each user role’s goal is created. </li></ul><ul><ul><li>WoN(Way of Navigating) : Set of navigational sub-structures which describe SNU. </li></ul></ul><ul><ul><li>WoN represents the best navigation path to achieve goal. </li></ul></ul>
  20. 20. Navigation Design(II) <ul><li>Mechanics of each navigation link must be identified for appropriate content: </li></ul><ul><ul><li>Text-based links, icons, buttons, switches... </li></ul></ul><ul><li>In addition to mechanics, the designer should establish navigation convention. </li></ul><ul><ul><li>Icons and graphical links should look “clickable” </li></ul></ul><ul><ul><li>Color should indicate the navigation link for text-based navigation. </li></ul></ul>
  21. 21. Interface Design <ul><li>The user interface is “First Impression” </li></ul><ul><li>Poorly designed interface will disappoint the potential user. </li></ul><ul><ul><li>Server errors causes to users to leave sites. </li></ul></ul><ul><ul><li>Do not force the user to read much text. </li></ul></ul><ul><ul><li>Avoid “under construction” signs. </li></ul></ul><ul><ul><li>Users prefer not to scroll. </li></ul></ul><ul><ul><li>Navigation menus and headbars should be available on all pages. </li></ul></ul><ul><ul><li>Navigation options (link to other contents) should be clear. </li></ul></ul>
  22. 22. Testing(I) <ul><li>The content model for the WebApp is reviewed to uncover errors - Check grammatical mistakes, errors in content, errors in graphical representation. </li></ul><ul><li>The design model for the WebApp is reviewed to uncover navigation error -Use cases allow to exercise each usage scenario. -These nonexecutable tests help uncover navigation errors. </li></ul><ul><li>Selected processing components and Web pages are unit tested -The smallest testable unit is generally a Web Page. -Unlike conventional unit testing which focus on algorithmic detail, page-level testing is done by processing content. </li></ul><ul><li>The architecture is constructed and integration test is made -Thread based testing can be used to integrate the set of Web pages. -Regression testing is applied to ensure that no side effects occur. -Cluster testing integrates a set of collaborating pages. </li></ul>
  23. 23. Testing(II) <ul><li>5. The assembled WebApp is tested for overall functionality. -Like conventional validation, test focuses on user-visible actions and user-recognizable output from system. </li></ul><ul><li>-To assist validation test, the tester should hold use-cases </li></ul><ul><li>6. The WebApp is implemented in a variety of different configuration </li></ul><ul><li>and is tested for compatibility. </li></ul><ul><li>-A cross-reference matrix that defines all probable operating systems, browsers, hardware platforms and communication protocols is created. </li></ul><ul><li>-With each possible configuration tests are conducted. </li></ul><ul><li>7. The WebApp is tested by monitored population of end-users. </li></ul><ul><li>-The WebApp is exercised by the chosen users and the results of their interaction with the system are evulated for all errros. </li></ul>
  24. 24. Management Issues <ul><li>Web Engineering is a complicated activity. </li></ul><ul><li>Many people are involved often working in parallel </li></ul><ul><li>In order to avaoid failure </li></ul><ul><ul><li>Planning must occur </li></ul></ul><ul><ul><li>Risks must be considered </li></ul></ul><ul><ul><li>A schedule must be established and tracked </li></ul></ul><ul><ul><li>Controls must be defined </li></ul></ul>
  25. 25. The WebE Team(I) <ul><li>Content developer and provider </li></ul><ul><ul><li>Generation and collection of content </li></ul></ul><ul><ul><li>Marketing or sales staff may provide product information and graphical images </li></ul></ul><ul><ul><li>Media producers may provide video and audio </li></ul></ul><ul><ul><li>Graphic designers may provide layout design and aesthetic content. </li></ul></ul><ul><li>Web publisher </li></ul><ul><ul><li>Must understand the both content and WebApp technology including HTML, XML, XHTML, database functionality, scripts and general Web-Site navigation. </li></ul></ul>
  26. 26. The WebE Team(II) <ul><li>Web engineer </li></ul><ul><ul><li>May have range of activities : architectural, navigational, interface design, implementation, testing </li></ul></ul><ul><ul><li>Understanding of component technologies, client/server architectures,HTML/XML and database technologies. </li></ul></ul><ul><ul><li>Working knowledge of multimedi-concepts, hardware-software platforms,network security. </li></ul></ul><ul><li>Support specialist </li></ul><ul><ul><li>Responsible for corrections, adaptations and enhancement to th site, updates to content, implementation of new procedures and forms. </li></ul></ul>
  27. 27. The WebE Team(III) <ul><li>Administrator </li></ul><ul><ul><li>Development and implementation of policies for operations. </li></ul></ul><ul><ul><li>Implementation of security procedures and access rights. </li></ul></ul><ul><ul><li>Measurement and analysis of Web-site traffic. </li></ul></ul><ul><ul><li>Coordination with support specialists. </li></ul></ul>
  28. 28. Project Management(I) <ul><li>Process and project metrics, project planning, risk analysis and management, scheduling and tracking. </li></ul><ul><li>In theory most of these activities can be applied to WebE projects. </li></ul><ul><li>But in practice, the WebE approach is considerably different. </li></ul>
  29. 29. Project Management(II) <ul><li>First; Most of the WebApps are outsourced to vendors. </li></ul><ul><ul><li>How is the capabilities of vendor determined? </li></ul></ul><ul><ul><li>How does one know whether a price quote is reasonable. </li></ul></ul><ul><li>Second; No WebE metrics have been published in the literature. </li></ul><ul><ul><li>Estimation is purely based on past experience with similar projects. </li></ul></ul><ul><ul><li>Although this estimation is useful,is open to error. </li></ul></ul>