Web Engineering: Models and Methodologies for the Design of Hypermedia Applications

Gennaro Costagliola, Filomena Ferrucci, Rita Francese Dipartimento di Matematica e Informatica - Universit di Salerno Via S. Allende, 84081 Baronissi (SA), Italy - e.mail: {gencos,filfer, francese}@unisa.it

Abstract
The development of Web applications requires a variety of tasks some of them involving aesthetic and cognitive aspects. As a consequence, there is a need of appropriate models and methodologies which allow the heterogeneus members of hypermedia projects to effectively communicate and guide them during the development process. In this chapter we describe some hypermedia models and methodologies proposed for the development of hypermedia applications.

Keywords: hypermedia, hypertext, World Wide Web, model, methodology, structured design

1. Introduction
Hypermedia applications are often advocated as the most powerful tool for an effective presentation and delivery of information. Indeed, on one hand the combination of a variety of media, such as text, sound, video and image, allows us to have multiple different representations of concepts and gives our senses new possibilities of enjoying information. On the other hand, the use of links allows for a natural and flexible access of information according to the associative nature of the human mind. As a matter of fact, the main goal of hypermedia applications derives from the Bushs idea to supplement human memory in order to provide an effective access and management of the growing knowledge and information [7].
1

Handbook of Software Engineering and Knowledge Engineering

Presently, an enormous number of hypermedia applications have been developed and the technological evolution of last decades has made the World Wide Web the primary support for their delivery. Indeed, organizations, industries, commercial activities, and people are putting an enormous amount of information on the Web. Nevertheless, such applications often fail to achieve their primary goal. As a matter of fact, the dimension of the navigation space and the high complexity of information can determine disorientation and cognitive overhead that may discourage the user. Moreover, such applications generally result in very poor quality products, with a spaghetti-like structure, which makes them hard to maintain and reuse [27]. The main reason of these problems is that the development of hypermedia and web applications is usually ad hoc, without the support of appropriate methodologies able to manage the high complexity of information. On the other hand, it is worth pointing out that traditional software engineering methodologies turn out to be inadequate for the development of such applications, because they generally do not address aesthetic and cognitive aspects that are especially relevant for an effective hypermedia design [28]. As a result, it is now widely recognized the need to develop a Web/hypermedia engineering meant to provide a systematic and disciplined approach for developing, documenting and maintaining Web/hypermedia applications. The problem is especially felt for large-scale applications with a long lifespan, such as digital libraries, software documentation, informative kiosks, archives, etc., for which maintenance and reuse are especially important issues. As a consequence, Web/hypermedia engineering represents an active research area, as also proved by the growing interest of journals and symposia for this topic [32, 29]. In particular, in the last years several models and methodologies have been proposed for supporting the development of hypermedia applications [11, 14, 17, 18, 22, 27]. The main goal of such models is to help designers to reason in a structured way on aspects that are specific of hypermedia, such as links, structure, navigation, etc. Moreover, they should enhance the communication among the heterogeneous members of a hypermedia project, such as programmers, system analysts, software managers, and users, as well as content-authors, librarians, musicians and graphic designers [20]. On the other hand, the methodologies should help engineers to manage the overall complexity of Web/hypermedia development which requires a variety of activities, such as

Web Engineering:Models and Methodologies

organizing the structure, choosing the contents and the presentation modality, some of them involving aesthetic and cognitive aspects. So, methodologies usually provide guidelines for performing such activities and suitable models for expressing the results of such operations. In the present chapter, we will focus on the models and the methodologies that have been proposed for the development of hypermedia applications. The discussion starts with a brief introduction of the main issues concerning with the design of hypermedia applications. Next, in Sections 3 and 4, the main features of the most representative models and methodologies are described. Finally, in Section 5 we conclude by comparing the models and the methodologies illustrated in the chapter.

2.

Basic Concepts and Cognitive Design Issues

Before introducing the main issues and principles concerning with the design of hypermedia applications, we give a brief overview of the characteristics of hypertext, multimedia and hypermedia [34,5]. A hypertext is modeled as a network of nodes that are connected through a set of links. A node usually represents a concept and a link connects related concepts. A multimedia presentation is characterized by a combination of multiple media, such as text, sound, and/or motion video. Multimedia presentations differ from the usual motion pictures or movies because of the user interaction. A hypermedia is a combination of hypertext and multimedia, having each component of the hypertext a self contained multimedia presentation. Links can be defined among any set of multimedia objects, including sound, motion video, and virtual reality. In the literature the terms of hypertext and hypermedia are often used interchangeably and we will make the same assumption in the sequel. The design of hypermedia applications involves specific cognitive aspects since it is necessary to make the document readable and the information effectively accessible. The readability of a given document can be measured taking into account the time the reader spends for constructing his/her mental model, where for mental model we intend the conceptual and operational representation that readers develop while interacting with a complex system. Mental models are formed by objects and by their semantic relationships [22].

Handbook of Software Engineering and Knowledge Engineering

To improve the document readability, the designer must facilitate the reader in the construction of his/her mental model by enforcing document coherence. Moreover, he/she should avoid exposing him/her to excessive cognitive overhead, due to the additional effort required for deciding what links it is worth following. Indeed, it is worth considering that the presence of a large complex hypermedia network provides the user with more degrees of freedom but at the same time increases his/her overhead and can make the reader disoriented with the feeling to be lost in the hyperspace. For avoiding this sensation and allowing the reader to find the expected information, it is necessary to provide suitable context and orientation functions able to give the user the clear perception of his/her position in the information space. Guided tours, history lists, breadcrumbs, bookmarks, and maps can be used to allow the reader to know his/her position in the overall navigational structure; how he/she has reached the actual position; how he/she can leave it. The navigational structure should also be carefully designed by providing the user with comfortable navigation spaces. They can be organized in different ways, such as linear, network, hierarchical, matrix and/or combination of them, depending on the information nature and user typologies. Moreover, it is worth pointing out that the development of complex hypermedia applications requires that the nodes can be reached in different ways. For example, we can reach William Shakespeare, display his book list and then choose Macbeth. This author could also be reached by exploring the Tragedies. To this aim it is necessary to provide different indexes or links to present the same information depending on the context. In this way the hypermedia structure is formed not only by nodes and links, but also by a set of contexts used to access to the nodes [19]. The previous considerations are summarized in the Thuring Framework by eight cognitive design issues and principles that should be taken into account during the hypermedia design process [22]. P1. Typed link tables should represent semantic relation, indicating the meaning of the connection between the content of two nodes. P2. Equivalencies should be indicated, i.e., the reader has to understand that the i formation associated to the same node is separated in several n windows. P3. The context of a node should be preserved; it should be displayed the actual node together with the neighboring nodes.

Web Engineering:Models and Methodologies

P4. Information Units with a higher-order should be used to collect information in composite components and to structure the document. P5. The document structure should be visualized in order to obtain a global view and to identify the relationship among topics. P6. The presentation should show cues describing the position of the reader into the structure. P7. The presentation should provide the appropriate facilities for direction, a reader can go forward and backward. If the document structure is complex and is organized in composite nodes, two additional movement types should be added: up and down, to move, respectively, to the higher layers and to the lower layers of the presentation. P8. The presentation should have a stable screen layout. To determine the appropriate process model for developing hypermedia applications it is important to point out that such applications often present unclear requirements that cannot be individuated without progressing in the advanced phases of the development process. Thus, the traditional waterfall software lifecycle is inappropriate [8]. As a matter of fact, this model does not admit any feedback between the various phases and any iteration, but it assumes that the process goes ahead from the beginning to the end, limiting the interaction with the user to the earlier developing phases and providing a system software too late for verifying whether or not it meets users needs. In these circumstances, to go back to the early phases and apply the appropriate modifications can result very hard and expensive. Indeed, process models that better support the requirement comprehension, such as incremental, prototyping and Spiral ones, turn out to be more suitable. The essence of the incremental development is to implement the final product as a series of successive increments, where each increment is a subsystem of the system we are implementing. An increment is developed by following the lifecycle phases, such as analysis, design, coding, testing, and integration and it is preceded by an exploratory phase, where it is possible to take in account the experience matured during the previous increments [13]. Another approach particularly appropriate when the initial requirements are not well defined is the prototyping. It consists in the developing a software system prototype to validate the requirements at the beginning of the project. The spiral development life cycle methodology is used to develop projects with a high degree of uncertainty for both the

Handbook of Software Engineering and Knowledge Engineering

requirements comprehension and the nature of the technology that changes rapidly. Hypermedia development projects have these characteristics and are particularly risky. Thus, such a spiral approach can be used for incrementally growing the application while decreasing the risks, using appropriate risk management activities offered by this development method.

Pictures, movies, text, sound

Fig. 1. A typical three layers modeling

Finally, we recall other some basic issues concerning with the design of Web/hypermedia applications, such as independence between data and presentation, independence between data and application, and independence between application and presentation. The independence between data and presentation requires that the logical description of data is independent from the way the data are presented to the user. This permits, for example, to change the presentation format and the navigation structure without altering the database schema and to use existing database schema for putting an application on the Web. Moreover, it enhances the independence between data and application. Such independence favors the reuse of data that can be employed by different applications and gives the possibility to have different views of the information depending on the user profile. The independence between application and presentation allows us to generate applications on different platforms and to enhance portability.

Web Engineering:Models and Methodologies

To realize such independences, it is suitable to model such applications on three levels as shown in Fig. 1 [25]: a presentation level, describing how the information should be displayed; a storage level, describing the physical representation of data, a logical level, creating the corrispondences between data stored in databases or files and the information accessible to the user.

3. Models
With regards to hypermedia applications, two kinds of models can be considered, namely the representational models and the design models. The representational models provide a mechanism to model the underlying structure of documents in order to facilitate the interchange of documents between different authoring tools. For example, the aim of the Dexter Hypertext Reference Model is to unambiguously define some important abstractions identified in a large number of existing and future hypertext systems in order to compare the functionalities of different systems and to enhance interoperability [23]. The Amsterdam Hypermedia Model extends the Dexter model to hypermedia systems carefully considering the synchronization problem which derives by the use of dynamics media, such as video, sound etc. [5]. Representational models are useful for developing authoring environments generating portable and interoperable applications. In this chapter we will focus on design models which are not systemoriented but application-oriented. They allow us to represent the result of the design activity by providing an abstract description of the system which points out some most meaningful features [30]. In general, the role of a design model is to allow for a deeply understanding of how an object has to be realized [29]. In the database area, for example, the popular Entity-Relationship model is used for both developing new applications and documenting existing ones. Hypermedia design models should answer to the need of formalizing the design of hypermedia applications and helping to reason in a structured way on the aspects that are specific of hypermedia such as links, structure, navigation, etc.

Handbook of Software Engineering and Knowledge Engineering

They eliminate the natural language ambiguity, and enhance the communications among people involved in the project helping them to identify structural inconsistencies and errors and to compare alternative designs [27]. Moreover, they improve the reusability, as the designed structure is available for developing similar applications. Finally, such models can be adopted as a basis to implement tools for the design of hypermedia applications. It is worth pointing out that hypermedia design models concern two aspects, such as authoring-in-the-large and authoring-in-the-small. In the first case the model refers to the specification and design of global and structural point of views of hypermedia applications and collects characteristics that are common to several applications of a given domain [21]. On the contrary, authoring-in-the-small refers to details about the specific applications organization and behavior, and depends on the implementation tools [20]. In the following two subsections we recall the main features of two models for authoring-in-the-large, namely the Trellis Hypertext Reference Model and Hypertext Design Model. Other models will be described in the next section where methodologies for hypermedia development will be illustrated.

3.1

The Trellis Hypertext Reference Model

The Trellis Hypertext Reference Model is based on a Petri Net representation of the structure of a document [1,14,15]. This model can be considered a behavioral model for hypertext [20]. In fact, the timed colored place/transition nets describe in an appropriate way the hypertextual interaction. Since a Petri net is a direct graph, the Trellis model can be employed for specifying the hypertext structure and the synchronization aspects. Petri net based hypermedia structure is an excellent way to represent parallel activities. Using this formalism, the designer can describe the contents that should be simultaneously shown in different windows on the screen; he/she can specify two or more sequences of contents that are displayed at the same time. In the latter case, the author can define the interaction between the parallel paths and establish that be synchronized at a given time.

Web Engineering:Models and Methodologies

Moreover, this formalism allows us to restrict the user access, to realize different versions of the same document and several browsing semantics that describe how information has to be visited.

3.2

The Hypertext Design Model

The Hypertext Design Model (HDM) is based on the entity-relationship model that is extended with a hierarchical organization [21]. HDM allows the designer to identify not only the atomic components of a hypermedia, but also the criteria for assembling the structures. Indeed, HDM is concerned with the aspects of authoring-in-the-large, and describes only the structure of hypertext, without considering specific implementation issues. Such a structure is represented through primitives and consists of information structures called entities, which represent physical or conceptual objects of the domain. An entity is the smallest independent piece of information which can be added or deleted from an application. For example, a Musical Opera (say Verdis La Traviata), a Painter (say Piero della Francesca) a lex (lex 8/11/2000) are entities. Entities are grouped in entity types; for example, the entity la Traviata and LAida belong to the entity type Musical Opera. These entity types differ from the ones of the entity-relationship modeling because they have an internal structure. Indeed, they are formed by hierarchies of components. As examples let us consider the Ouverture component of La Traviata and Le Baptism of Crist, painting component of the entity Piero della Francesca. Components are not autonomous and exist only as a part of an entity. Components are in turn made by units. Each unit shows the content of a component under a particular perspective. A perspective is a different presentation of the same content. For example, in multilanguage applications the same argument must be described with different languages (i.e. Italian and English). A unit is characterized by a name and a body. Filling the contents into the appropriate bodies corresponds to authoring-in-the small. For example, Piero della Francesca/Italian-life is the unit describing in Italian the life of the painter Piero della Francesca. All the entities belonging to a given type have the same set of possible perspectives on their components. For example, if the entity has four perspectives, all the components associated to it must have four perspectives too. In Table 1 each component musical piece contains a digital recording,

10

Handbook of Software Engineering and Knowledge Engineering

a musical score, a textual comments exposed in English and a textual comment exposed in Italian [3].

ENTITY

Vivaldis Four Season SUMMER (ETC..) Musical score Textual Textual Comments/ Comments/It English alian UNIT UNIT

COMPONENTS: SPRING PERSPECTIVES: Digital Recording

UNIT

UNIT

Table 1. An example of the entity composition

One of the most appealing features of HDM is the introduction of different categories of links that take into account the different relationships existing among information elements, such as the relation among entities (i.e. capturing domain relations) and the navigational rules (how the user can move on the hypermedia structure). In particular, perspective links allow us to associate its units to a component, for example Le Baptism of Crist/Italian-text and Le Baptism of Crist/Italian-picture are associated to the component Le Baptism of Crist. They associate homogeneous elements under the same perspective and regarding to the same subject. Extending the definition used in the database field, an HDM schema is a set of entity and link type definitions, whilst a schemas instance is a set of actual entities and links, obeying the constraints which have been defined in the schema. A hypertext application is composed by a hyperbase, formed by entities, components, units and links, and a set of access structures, said outlines. An outline is a part of the hypertext containing navigational information, such as guides, maps and tours. Outlines allow the author to organize a set of links in the hyperbase and are not specified in the schema, but can be added in the application in order to give an entry point to the user.

Web Engineering:Models and Methodologies

11

HDM and its descendent HDM2 let the designer describe the schema, but provide little information on the procedure to be used in hypermedia design and development [26]. It naturally favors a top-down development approach, even if this methodology is only induced by HDM, but not explicitly described in the model. Nevertheless, such a model has a notable relevance because the Relationship Management Methodology (RMM) and the ObjectOriented Hypermedia Design Model (OOHDM), two important methodologies described in the following, are based on it.

3.3 The UML extensions to Model Hypermedia Applications

In the recent years many object-oriented modeling languages have been developed for software engineering. The Unified Modeling Language (UML) is the synthesis of many of such notations and it is considered a standard for the industrial development software. It is a modeling language, not a methodology, for object-oriented design and analysis. In [11] UML has been extended to support the temporal synchronization of multimedia objects and to describe the spatial presentation, while in [16] UML has been extended on the base of OOHDM methodology, described in the following. Navigational modeling features have been added to UML, such as a new diagram type for describing the object to visit, their access modality and the correspomding contexts.

4.

Methodologies

A methodology is a comprehensive, multiple-step approach to system development that guides the development process and influences the quality of the final product. It consists in detailing both the activities to be carried out and the deliverables that should be provided at the end of each activity. Indeed, it gives a full set of concepts and models which are internally selfconsistent and a collection of rules and guidelines. It is obvious that does not exist the best methodology, but only the most appropriate for the product we are developing. Moreover, different methodologies can be employed in different phases of the development process, because each one better solves a specific problem. In the sequel we recall the main features of some notable methodologies which have been proposed for the development of Web/hypermedia applications. Some

12

Handbook of Software Engineering and Knowledge Engineering

approaches based on visual and multidimensional languages are summarized elsewhere in this Handbook by S. K. Chang and T. Shih.

4.1

The Relationship Management Methodology

The Relationship Management Methodology (RMM) is a methodology for structured design of hypermedia systems aiming to facilitate the design of WWW sites, and their seamless integration with databases and enterprisewide information systems [24,26]. Indeed, as a notable feature it allows us to obtain separation of data, structure and user-interface.

m-Slices

Fig. 2. The Relationship Management Data Model primitives

Web Engineering:Models and Methodologies

13

RMM is focused on the design phase and employs the Relationship Management Data Model (RMDM), which represents an integration of E-R and HDM models. RMDM provides a language for describing information objects and navigation modality in hypermedia applications. The language primitives are illustrated in Fig. 2. while and example of application's design specified by an RMDM diagram is shown in Fig. 3 [26]. The RMDM primitives can be divided into E-R primitives, m-Slice domain primitives, and access primitives. E-R primitives are taken from the Entity-Relationship modeling, and describe how information is structured in the application domain. Entities and their attributes represent abstract or concrete objects and the relationship between entities are modeled by 1-1 or 1-n associative relationships; m-Slices are used to model small information units of a presentation. Indeed, m-Slices are defined by grouping attributes of a given entity of the E-R diagram or by grouping others m-Slices. The m refers to Russian Matrjeska dolls, because m-Slices are nested in other mSlices until the presentation unit is defined. This approach let the design of user interface be more modular and support reuse, because m-Slices can be employed several times in the presentation. access primitives allow us to model and to support navigation across different entities. An RMDM diagram describes how users will navigate across a hypermedia application. In Fig. 2 the access primitives are classified into unidirectional links; bidirectional links; grouping, conditional guided tour, conditional index, and conditional indexed guided tour. A guided tour is a linear path through a collection of elements allowing the user to move either forward or backward on the path. An index is a table of content to a list of entity instances, providing the access direct to all the elements of the list. A grouping is a mechanism serving as an access point to other parts of the hypermedia document. For example, the initial screen of many applications contains a menu or a set of buttons that provide access to different functions or classes of information. It is also possible to combine index and guided tour to have the indexed guided tour. A predicated is associated to the links of the access primitives to indicate which instances of an entity are accessible through that primitive. For example, the predicate (rank=associate) indicates

14

Handbook of Software Engineering and Knowledge Engineering

that only the entities whose rank is associate are involved in the guided tour, obtaining a conditional guided tour.
DBA Menu

Registred User Order Index by data

Order Index by user USER ORDER

Contains NAME

Catalog Order Index (user =login)

User Menu

Fig. 3. An RMDM diagram

RMM describes completely the software development cycle, but focuses on the critical design phases. It does not address early and late lifecycle activities, such as project management, feasibility studies, requirement analyses, planning, evaluation and maintenance. The methodology foresees an iterative approach to the development since it encourages feedback between the various development steps. Let us give a brief description of the eight steps forming RMM, some of which can be conducted in parallel.

Web Engineering:Models and Methodologies

15

During the Entity-Relationship design the designer models the information domain and its relationship via an E-R diagram. This model is familiar to the designers, well documented and can be used for modeling the information dependencies in a variety of application domains. This kind of analysis helps to determine a view of the application domain independent from the presentation and to identify relationships across which navigation can be supported. Moreover, if the target application is a Web interface for an existing database, its E-R diagram can be reused. The next step, the application diagrams design, consists in modeling the information at presentation level and focuses only on the presentation structure. Application diagrams show the content of each web page and the connections among them. During the m-Slice design (E-R+ diagram) the attributes of one or more entities that should be displayed simultaneously on the screen are modeled and details are hidden, such as elements of the user interface or details nested in other m-Slices. The methodology suggests how to create this kind of diagrams in detail. Navigational design: this phase allows the designer to establish both how users will access to information and the paths for the hypermedia navigation. To this aim, designers specify menu-like structures using indices and guided tours. The lower level structure can be collected in higher level structure, obtaining a hierarchical access based on menu. At the end of this step all the access structures will be described by a RMDM diagram, as shown in Fig. 3. The remaining steps are not characteristics of this methodology and are briefly illustrated in the following. In the conversion protocol design phase the designer describes how abstract constructs have to be transformed into physical-level constructs; for example, it is possible to define how a slice is converted into an HTML Web page, or an index can be implemented by using an HTML form. The User-Interface Design and Construction step considers how the information structured in the previous phases has to be presented to the final user. For example, index aspect, button layout, etc. In this phase it is important to take into account that for many WWW applications it is crucial to exhibit a common look and feel; Run-time behavior design describes the functionality to be realized at run-time; for example, possible inclusion of search engines, dynamic generation of pages, backtracking that allows the user to go back to

16

Handbook of Software Engineering and Knowledge Engineering

previously visited nodes; history lists, maintaining an ordered list of each visited node, etc. The methodology let the designer use both top-down and bottom-up approach. The development process results flexible and iterative and the quality of the final product is i proved because it turns out to be structured, m extensible, maintainable and reusable. Another appealing feature of the RMM methodology is the availability of a software tool, named RM-Case, supporting RMM design and development and producing the diagrams associated [10].

4.2

The Object-Oriented Hypermedia Design Model

The Object-Oriented Hypermedia Design Model (OOHDM) is an objectoriented hypermedia design methodology, based on HDM [31]. It allows us to build large hypermedia applications using a mix of incremental and prototype-based process model. OOHDM supports the most part of development process, except the early phases of the lifecycle. It consists of four steps, namely conceptual design, navigational design, abstract interface design and implementation. Each step allows us to build an object-oriented model focused on a design aspect. These steps can be accomplished separately, obtaining a reusable and modular design. Conceptual Design An object model is used to provide a conceptual model of the application domain. This model refers to the usual object-oriented modeling principles, extended by concepts derived from HDM and similar to perspectives. Navigational Design During this phase the information described in the conceptual model is structured to define different views, a view for each user profile. To this aim, OOHDM defines a navigational model that takes into account the different user types and the actions they can perform. Navigational design is accomplished through the definition of two schemas: the navigational class schema, and the navigation context schema. The navigation class schema let the designer define classes having similarity with the conceptual classes, but with several differences. For example, in a fly-company Website, a node class "Fly" for a travel agent does not contain several attributes of the "Fly" conceptual class; e.g., crew

Web Engineering:Models and Methodologies

17

name, etc.... as they represent i formation which would not be visible in the n travel agent view. The navigation context schema allows the designer to define which information is reachable in a given node in a particular context. Thus, a navigational context is a set of nodes, links, context classes and other (nested) navigational contexts. Abstract Interface Design The application interface is defined through the abstract interface model. It is built by defining interface classes, i.e. objects visible to the user (e.g. a picture, a city map, etc.). They are an aggregation of primitive classes, for example buttons and text fields, and recursively of interface classes. In this phase the designer establishes how to activate the navigation and to realize the synchronization among multimedia interface objects. Here, the association between interface objects and navigational objects is created. Interface behavior is declared by specifying how to handle external and usergenerated events and how the communication takes place between interface and navigational objects. Implementation This phase consists in mapping the interface objects into implementation objects, related to the implementation environment that can involve different platforms, such as, Hypercard, Toolbook, Director, HTML. The OOHDM methodology improves maintainability and reusability, thanks to both the separation of the design phases and the abstraction capabilities which are characteristics of the object-oriented design. OOHDM extends the model HDM by including special purpose modeling primitives for both navigational and interface design. Moreover, it introduces the navigational contexts and offers a great relevance to the interface design. In fact, it models the man-machine interaction and considers the effect of each event generated by the user both on the interface and the navigational aspects. In conclusion, it is one of the best available methodologies and is supported by the design patterns described below.

4.3

Design Patterns

Several design patterns have been proposed to support a hypermedia design methodology [19]. These patterns favor the reuse of the navigation, interaction and interface structure of hypermedia applications and help the

18

Handbook of Software Engineering and Knowledge Engineering

designer in creating a navigation structure without cognitive overhead and a more comfortable navigation through the hyperspace. In the sequel we report some relevant patterns. The navigational design patterns suggest to the designer how to organize navigation in a clear and understandable way for the reader. To this aim, a node should be considered as a self-contained unit of information, focused on a given argument. It should not be fragmented on a large number of pages, neither contain information on too many topics. For creating a node, static node creation can be employed whether the information is rarely updated; otherwise, as in the case of data obtained from a database, a node should be created dynamically. Similarly, links are created statically if the application is static and the nodes are created statically too. Otherwise, dynamic links are preferred. The interface patterns are thought as guidelines for GUI designers. Let us consider, for example, information on demand. This aspect regards how to present information that cannot be integrally displayed on the screen. It is advisable to display only a subset of the information on the screen and let the reader ask for to the remaining information by using active interface objects, such as buttons. The Information-interaction decoupling pattern allows the designer to differentiate controls and contents in the interface. The solution consists in grouping separately input and output communication channels. Another pattern suggests to group the different kinds of controls in different parts of the screen. For example, we can decide to use three different areas, one for global navigation controls (index, back, menu, etc..), another for information on demand and another for context controls. The behavior anticipation pattern let the reader have a way to understand the result of the activation of an object. To this aim the designer provides a differentiated feed-back for each interface object. For example, an interface similar to the tool tips of Windows can show a brief explanation of the target node when this is selected. Process feedback consists in informing the user about the status of the interaction. This aspect is important whether the operation to be executed is non-atomic, takes a long time or may fail. In these circumstances the user can become impatient and he/she can select more times the same option or other ones with unpredictable results. To avoid these troubles, it is advisable to give to the reader the appropriate feedbacks describing the status of the operation in course, such as host contacted, transferring, done.

Web Engineering:Models and Methodologies

19

News patterns regard the need of communicating to the user if there is new information on the Web site. To this aim, the site homepage has to show an area dedicated to the news in which are presented the descriptive headlines regarding them and that are linked to the associated pages.

4.4

The Entity-Relationship Modeling of Information Artifacts

The Entity-Relationship Modeling of Information Artifacts (ERMIA) is a high-level design method [18]. Information artifacts store, retrieve and elaborate information. They are modeled through an enriched version of the Entity-Relationship modeling, called Entity-Relationship Modeling of Information Artifacts. As a notable aspect, ERMIA provides a support for cost analysis. In particular, it concentrates on metrics for measuring the effort needed to search or to modify a structure. To this aim, the model takes into account the internal structures of entities, making the modeling process independent from the implementation details. Each internal structure has its requirements of memory and time. Five types of internal structures are proposed: pile, chain, sorted list, hashed, unsearchable. The first four structures have the usual meaning, the fifth means that data can only be accessed through a catalog, i.e., it is not provided any particular access mechanism. This model allows the designer to distinguish between the conceptual information and its representation by defining viewports, which represent relations between entities and displays. A conceptual information can have different viewports. ERMIA is applicable in the early phases of the lifecycle where it encourages reasoning on the different design strategies and allows us to evaluate the interfaces (cost of search, working memory load, etc), compare different mental models (designers'/users', across different users), and reflect about both the conceptual description and the perceptual aspects of a system.

5. Conclusions
The increasing demand of services and information on the WWW requires the development of high-level quality presentations. The challenge is to support this technological evolution with appropriate Web/hypermedia

20

Handbook of Software Engineering and Knowledge Engineering

engineering approaches, appearing very different from the traditional software engineering ones. Such applications, for their nature, present unclear requirements that cannot be individuated without progressing in the advanced phases of the development process. Thus, it is widely recognized that the traditional waterfall software lifecycle is inappropriate for hypermedia applications [8]. Process models that better support the requirement comprehension, such as incremental, prototyping and Spiral ones, turn out to be more suitable. Besides process models we have to consider appropriate methodologies for guiding the development of such applications. Hypermedia development processes and methodologies influence the quality of the final product and the general management style, improving the organization. In this chapter we have overviewed several methodologies and models that have been proposed for an effective development of Web/hypermedia applications. Table 2 summarizes the comparison among the approaches to hypermedia application design we have described and, in particular, underlines the following salient aspects: methodology: the considered approach provides models and guidelines; completeness: the most part of the lifecycle is deeply treated; model: the approach gives some models; perspective/context: the approach presents the information by using different indexes or links depending on the context; tool CASE: there exists a tool CASE supporting the considered approach; cognitive aspects: the approach gives guidelines to improve the document readability; cost metrics: the approach supports cost analysis; synchronization: the approach allows the designer to describe temporal relationships between different media.

Each one of the models and the methodologies focuses on specific issues. In particular, the Hypertext Design Model is based on an extension of the Entity-Relationship data model and allows us to describe the global structure of the application (authoring-in-the-large). HDM is the root of the ObjectOriented Hypermedia Design Model, a methodology for the construction of

Web Engineering:Models and Methodologies

21

large hypermedia application through an incremental, prototype-based development approach. The Relationship Management Methodology carries a structural construction of Web sites, emphasizing navigation aspects, and integrates Web sites and enterprise database. A notable aspect of the Trellis model is the possibility to specify the hypertext structure and the synchronization aspects, whilst ERMIA is a high-level design method providing a support for cost analysis. Finally, UML extensions integrate UML with navigational modeling features. Thus, it is worth noting that neither the best methodology nor the best model exists, but only the most appropriate for the product we are developing.

Methodology Completeness Model Perspective/Context Tool Case Cognitive Aspects Cost metrics Synchronization

RMM X X X

HDM

X X

OOHDM X X X X X

ERMIA

TRELLIS UML ext. X X

X X

X X X X

X
Table 2. Models and Methodologies comparison

References
1. V. Balasubramanian, State of Art Review on Hypermedia Issues and Applications, http://members.tripod.lycos.nl/Lollie. 2. V. Balasubramanian, M. Bieber, T. Isakowitz, Systematic Hypermedia Design, Information Systems, (1998). 3. M. Bernstei, F. Garzotto, P. Paolini and D. Shwabe, Tools for Designing Hyperdocuments, Hypertext/Hypermedia Handbook, Mc Graw Hill, Software Engineering Series, (1991), 179-207. 4. G. Booch, J. Rumbaugh and I. Jacobson, The Unified Modeling Language User Guide, Addison-Wesley, Reading MA, 1998.

22

Handbook of Software Engineering and Knowledge Engineering

5. D. Bulterman, L. Hardman and G. Van Rossum, The Amsterdam Hypermedia Model, Communication of the ACM, (February 1994), Vol.37, No.2. 6. D. C. A. Bulterman, J. Jansen, K. S. Mullender and G. van

Rossum, CMIFed: A Presentation Environment for Portable Hypermedia Documents, ACM Multimedia , (August 1993), 183 188.
7. V. Bush, As we may think, Atlantic Monthly, (July 1945). 8. H.J. Chang, T.Y. Hou, A. Hsu, S.K. Chang, The Management and Application of Tele-Action Objects, ACM Multimedia Systems J., (1995) Vol.3 No. 5-6, Springher Verlag, 204-216. 9. S. K. Chang, Multimedia Software Engineering, Kluwer Academic Publishers, (2000). 10. A. Diaz, T. Isakowitz, V. Maiorana and G. Gilabert, RMCase: A tool to design WWW application, World Wide Web Journal, (1995), Vol.1, No. 1. 11. G. Engels and S. Sauer, Extending UML for Modeling of Multimedia Applications, proceedings 1999 IEEE Symposium on Visual Languages, Tokyo, Japan, (1999), pp. 80-87. 12. M. Farooq and W. Dominick, A survey of formal tools and models for developing user interfaces, International Journal of Man-Machine Studies, (1988), No. 29, 479-496. 13. Martin Fowler, http://www.aw.com/cseng/titles/0-201-895420/techniques/evolution.htm 14. R. Furuta and D. Stotts, Petri Net Based Hypertext: Document Structure with Browsing Semantics, http://www.cs.unc.edu/~stotts/pds/cv.html. 15. R. Furuta and D. Stotts, The Trellis Project, http://www.cs.unc.edu/~stotts/Trellis/. 16. A. Garrido, A. Helmerich, N. Koch, L. Mandel, L. Mandel, L. Mandel, G. Rossi, L. Olsina, G. Rossi, M. Wirsing, Hyper-UML: Specification and Modeling of Multimedia and Hypermedia Applications in Distributed Systems, Second Workshop on the German-Argentinian Bilateral Programme for Scientific and Technological Cooperation, Knigswinter, Germany, (March 1999). 17. A. Ginige, D. Lowe, j. Robertson, Hypermedia Authoring, IEEE Multimedia, (1995), Vol. 2, No. 4.

Web Engineering:Models and Methodologies

23

18. T. Green and D. Benyon, The skull beneath the skin: Entity-Relationship Models of Information Artifacts, International Journal of HumanComputer Studies, (1996), Vol. 6, No. 44, 801-828 19. A. Garrido, G. Rossi and D. Schwabe, Pattern Systems For Hypermedia, Proceeding Plop, (1997). 20. F. Garzotto, L. Mainetti and P. Paolini, Hypermedia Design, Analysis and Evaluation Issues, Communicatin of the ACM, (August 1995) Vol. 38, No. 8. 21. F. Garzotto and P.Paolini, HDM A Model-Based Approach to Hypertext Application Design, ACM Transaction on Information Systems, (january 1993), Vol. 11, No. 1, 1-26. 22. J. Haake, J. Hannemann and M. Thuring, Hypermedia and Cognition: Designing for Comprehension, Communication of the ACM, (August 1995), Vol. 38, No. 8. 23. F. Halasz and M. Schwartz, The Dexter Hypertext, Communication of the ACM, (February 1994), Vol. 37, No. 2. 24. T. Isakowitz , What is RMM?. http://www.stern.nyu.edu/~tisakowi/rmm/What_is_RMM.html 25. T. Isakowitz, A. Kamis and M. Kuofaris, Extending the capability of RMM: Russian dolls and Hypertext, Proceedings of the Thirtieth Annual Hawaii International Conference On System Sciences, Hawaii, USA, (1996). 26. T. Isakowitz, E. A. Sthor and P. Balasubramanian, RMM: a methodology for structured hypermedia design, Comm. On the ACM, (August 1995)Vol. 38, No. 8. 27. D. Lowe, W. Hall, Hypermedia and the Web, Worldwide series in computer science, John Wiley & Sons, (1999). 28. J. Nanard and M. Nanard, Hypertext design environments and the hypertext design process, Communication of the ACM, (1995) Vol. 38, No. 1, 49-56. 29. R. Pressman, Software Engineering: A Practitioners Approach. 5th Edition, The McGraw-Hill Companies, (June 1, 2000). 30. I. Sommerville, Software Engineering. Fifth edition, Addison-Wesley, (1995). 31. D. Schwabe and G Rossi, Developing Hypermedia Applications using . OOHDM, Workshop on Hypermedia Development Processes, Methods and Models, Hypertext'98, Pittsburgh, USA, (1998).

24

Handbook of Software Engineering and Knowledge Engineering

32. Special Issue Web Engineering, IEEE Multimedia, Guest editors: A. Ginige and S. Murugesan, (Jan-Mar 2001). 33. B. White, Web Document Engineering. http://www5conf.inria.fr/fich_html/slides/tutorials/T14/overview.htm 34. http://whatis.techtarget.com/