Chapter 2 -- A Developer's Tour of the Web Chapter 2 A Developer's Tour of the Web CONTENTS An Overview of the Web's Potential Web Functions Web Development Phases Developer's Tour Check This chapter orients you to the powerful ways that the Web is already being used for information, communications, interaction, and computation in a variety of application areas. Major aspects of Web development, which are described in detail in Parts II through V, are illustrated here as they are used in real-world applications. These examples include some of the oldest applications on the Web along with some of the newest. These older applications adopted, in many cases, communications features of the Web early and have remained definitive examples for their application areas. These examples should give you a sense of the many ways in which you can use the Web, and they also provide a preview of the development topics this book covers in detail. An Overview of the Web's Potential As outlined in Chapter 1, the Web is a flexible system for communication, and it can be used in many contexts, ranging from individual communications on home pages to group and mass communications. In addition to these contexts, the Web serves many communications functions: Information delivery  A Web browser gives you a viewer to look into FTP space, Gopher space, or hypertext information on the Web. The structure of hypertext enables user selectivity because of the many ways a user can choose to follow links in hypertext. Communication  People can use Web hypertext to create forums for sharing information and discussion and helping group members make contact with each other. With interactive languages such as Java or Limbo, users can interact in real-time discussions. Interaction  Using gateway programming, a Web developer can build interactivity into an application, providing the user with a way to receive customized information based on queries. Gateway programs also can allow a user to change or add to an information structure. Using Java, this interactivity can be richer and performed in real time. Computation  Also using gateway programming or a language such as Java, you can use the Web to provide an interface to other applications and programs for information processing. Based on user selections, a Web application can return a computed or customized result. The figures in this chapter use the symbols shown in Figure 2.1 to illustrate and distinguish among the Web functions. Figure 2.1 : Symbols for representing Web functions. Figure 2.2 shows a schematic of the selectivity that is possible with hypertext. When the user accesses the Web server, content is contained in pages of hypertext. The links in the hypertext pages give the user a great deal of choice, or selectivity, for encountering information in the database. No information is customized to user inputs or computed based on user requests, however. Although this server gives the user great flexibility in information retrieval because of the hypertext design of its pages, it is not interactive. Interactivity is an over-used word in media development. All kinds of claims are made about products-such as television and CD-ROM games-claiming that they are interactive. A dictionary definition of the word interactivity characterizes it as in-ter-ac-tive \-'rak-tiv\ adj 1: mutually or reciprocally active; 2: of, relating to, or being a two-way electronic communication system (as a telephone, cable television, or a computer) that involves a user's orders (as for information or merchandise) or responses (as to a poll) -http://c.gp.cs.cmu.edu:5103/prog/webster? Interactivity in the on-line world doesn't just have to do with the selectivity hypertext offers, though. It involves a range of human-computer interaction, encompassing orders and responses that differ in kind, quality, and scale. The hypertext schematic in Figure 2.2 shows the following: Figure 2.2 : Selectivity with Web hypertext. Orders  The kind of orders a user can give to select hypertext is restricted to the selection of a browser link. The quality of this order is a one-of-many selection. The scale of the order is the Web containing the links to select. Responses  The response a user may receive as a result of a hypertext link could be another page of hypertext or a multimedia file (an image or a sound file, for example). The quality and scale of this response depends on the media type and content the user selects. The selectivity of hypertext is a powerful communications technique. Figure 2.3 illustrates how group communication can be accomplished on the Web. User A encounters information through a Web browser on a server. The hypertext page A retrieves links to a list of pages; each contains links to hypertext pages maintained on remote servers by the users B, C, D, and E. Group member B is the Web master-the person who operates the software and coordinates the delivery of the content-for this server. Group member E is an information provider who does not link back to the group's server and therefore might not claim group identity. This type of group communication is common on the Web when people collaborate to create or share information. This communication is passive in the sense that only group member B can change the links on the Web server through manipulation based on requests (via e-mail or some other means) from the other users. Figure 2.3 : Passive Web group communication. Although hypertext alone doesn't give a user much interactivity, the use of gateway programs is a way to increase the kinds of orders and responses a user can give and receive. Figure 2.4 illustrates an executable program that accepts input from the user through a Web page. Based on these user inputs, this executable can compute a result and (possibly also using information from the database) return this customized information result to the user. Moreover, the executable program also allows the user to (possibly) change the contents of the database or to make some other change in the database or files on the server. These changes might include altering the structure or contents of hypertext or the contents of other files. This is the scheme of Common Gateway Interface (CGI) programming. Figure 2.4 : Interactivity enabled by CGI programs. In contrast to passive Web group communications, Web group communications can be interactive in much the same way as described previously for database retrieval or computation. Instead of altering or looking up information in a database, however, an executable program enables a user to alter the hypertext structure on the group's server. In Figure 2.5, user A has created a home page and has linked it to the group's server (link 1). Then, using the interactive program, user A can create link 2, which connects A's home page to the group's server. This same program can be used by other potential group members. This arrangement for interactive communication on the Web is fairly rare because of obvious security concerns. This level of interactive communication can be used in many other applications in other variations on the basic scheme shown in Figure 2.5, however, resulting in potentially dynamic group communication. Figure 2.5 : Interactive Web group communications. CGI programming is a step up in interactivity, because its orders and responses can be characterized: Orders  The kinds of orders a user can give to a CGI program include a set of values for variables. These variables can be character, numeric, or choices from an HTML form. The quality of this order is a several-of-many selection. The scale of the order does not have to be restricted to the Web containing the links to select, but it must include database or other information. Responses  The response a user may receive as a result of a CGI program execution can be another page of hypertext or a multimedia file (an image or a sound file, for example) in addition to any outcome computed as a result of the CGI program execution. The quality and scale of this response has to do with the media type and content the CGI program generates or what changes it makes in a database as a result of execution. There is still a richer possibility for interactivity on the Web through the use of network programming languages such as Java or Limbo. Java, developed by Sun Microsystems, is a computer programming language that brings animation and interaction to the World Wide Web. Java makes it possible for developers to create content that can be delivered to and run by users on their computers. This software can support anything that programmers can dream up: spreadsheets, tutorials, animations, and interactive games. With the delivery platform as the Web page, this software can support a variety of information tasks with true interactivity; users can get continuous, instantaneous feedback for applications in visualization, animation, and computation. Java's level of interactivity is possible because of how Web browsers that can interpret Java programs for the Web (called applets) operate. In a non-Java-enabled Web browser, information content is defined in terms of Multipurpose Internet Mail Extensions (MIME) specifications, which define a variety of multimedia document formats. This content is specified so that it can be displayed in the browser or in a helper application (such as images, sound, and video). The result is that the user chooses and then observes content. A Java-enabled browser also downloads content defined by MIME specifications and displays it. When a Java-enabled browser downloads a Web page containing a Java applet, indicated by the hypertext tag (<APPLET>), the browser knows that a Java program (applet) is associated with that tag. The Java-enabled browser then can download that applet from the information provider's Web server. The applet is in a special format called bytecodes. The Java-enabled browser can interpret these bytecodes and run them as an executable program on the user's computer host. The result is that the user downloads and runs an executable program-not just content displayed in the Web browser. Java also uses this same scheme to support programmer-defined protocols and special document formats. Figure 2.6 shows Java's technical scheme and illustrates this sequence of events: Figure 2.6 : Java's technical scheme. The user sends a request for an HTML document to the information provider's Web server. The Web server returns an HTML document to the user's browser. The document contains the <APPLET> tag that identifies the applet. The bytecode corresponding to that applet is transferred to the user's host. This bytecode was created previously by the Java compiler using the Java source code file for that applet. The Java runtime system on the user's host interprets the bytecodes and provides display. The user then can use the applet with no further downloading from the provider's Web server. This is because the bytecode contains all the information necessary to run the applet. Java's interactivity is in real time. Figure 2.7 illustrates how the user can interact with the display. Figure 2.7 : Java's interactivity is in real time for input and display. Java programming is an even richer form of interactivity because its orders and responses can be characterized: Orders  The kinds of orders a user can give to a Java applet include any set of values for variables (such as those used in CGI programs used with HTML forms) plus any mouse, cursor, keyboard, or other input the Java program can monitor. The quality of this order is a many-of-many selection. The scale of the order does not need to be restricted to the Web containing the links to select, but it must include database or other information that may be located on the Internet. Responses  The response a user may receive as a result of interacting with a Java applet can be any graphic or other response the Java programmer can create. The quality and scale of this response depends on its media type and the content the applet generates as a result of user interaction. The keys to Web interactivity, as shown in the schemes for both CGI programs and Java applets, are the executable programs that can be associated with Web hypertext pages. Creating these programs and linking them with Web pages relies on skills in gateway programming, the topic of Part IV, "Gateway Programming." Parts II and III cover the many aspects of developing hypertext pages for information delivery, as well as many aspects and processes of Web development in general. Chapter 18, "Development and Language Environments," covers Java, Limbo, and other network programming systems. The rest of this chapter presents specific examples of Web functions in information delivery, communication, interaction, and computation. Then, examples of good Web design and implementation are shown to illustrate the expressive possibilities of the Web. Web Functions As shown in the earlier diagrams, the Web can function very well to allow people to combine and present information-either in a one-way mode of information delivery or an interactive mode. Information delivery is one of the most popular functions of the Web. As described in Chapter 1, the Web is an information integrator because it can link information from a variety of Internet protocols. Information Protocols The basic function of a Web browser is to display information to the user. Therefore, one way a browser of the Web functions is to provide a view into a variety of information spaces. This section summarizes the major information spaces a Web browser can integrate and shows brief examples of each. File Transfer Protocol File Transfer Protocol (FTP) sites offer the user access to a set of files and directories. Figure 2.8 shows how an FTP site (ftp://ftp.merit.edu/) appears through a Web browser. This mode of information delivery allows for a tree-like structure (directories can contain other directories as well as files). The names of the files and directories, however, are limited by the file-naming conventions of the system delivering the information. The expressiveness of the information structure at an FTP site therefore is not very rich. Figure 2.8 : An FTP site through a Web browser. FTP Space Reference Site list  ftp://rtfm.mit.edu/pub/usenet/news.answers/ftp-list/ Subject tree  Usenet FAQs atftp://rtfm.mit.edu/pub/usenet/ Archie via Telnet  telnet://[e-mail] Archie via the Web  http://web.nexor.co.uk/archie.html Telnet Telnet is a protocol that enables users to log onto remote host computers. After users log onto the remote computer, they can interact with the software running the session. A Web browser may invoke a Telnet session as a result of a user selecting a Telnet URL. Figure 2.9 shows a Telnet session as a result of a user selecting the URL telnet://downwind.sprl.umich.edu:3000/ in the Lynx Web browser. Figure 2.9 : A Telnet session invoked from the Lynx browser. Telnet Space Reference Hytelnet via Web  http://library.usask.ca/hytelnet/ Keyword searcher  Search Hytelnet at http://galaxy.einet.net/search.html Gopher Gopher is an information system that was designed at the University of Minnesota and provides a very efficient way to organize information and provide it for other people to browse on the Internet. The term Gopher refers to the university's eponymous mascot and also hints at the operation of the Internet Gopher itself-to go for information. Figure 2.10 shows a sample Gopher menu from the Minnesota Gopher (gopher://gopher.tc.umn.edu/). The screen shows icons representing directories (file folders) and searches (binocular icons). Figure 2.10 : A Gopher site through a Web browser. Gopher Space Reference Site list  From the Minnesota Gopher at gopher://gopher.micro.umn.edu Subject tree  Gopher Jewels at http://galaxy.einet.net/GJ/index.html Keyword searcher  Veronica at gopher://veronica.scs.unr.edu/11/veronica Web Sites The popular Internet protocols FTP, Telnet, and Gopher are just part of the information delivery power of the Web. The most expressive information-delivery method is using hypertext to link multiprotocol information together. Figure 2.11 shows the opening page of the World Wide Web Virtual Library (http://www.w3.org/vl/). Figure 2.11 : The WWW Virtual Library (courtesy of the World Wide Web Consortium). Although its appearance is somewhat like the linear lists of Gopher and FTP sites, hypertext pages need not appear so. Figure 2.12, for example, shows the definition of the term Scheme in the Free On-Line Dictionary of Computing (http://wombat.doc.ic.ac.uk/), a compendium of terms and definitions related to computing. Notice how many of the terms in the definition are hotlinks to other definitions within the dictionary itself. In this way, this dictionary is an excellent example of the way hypertext can be used to create meaning. Figure 2.12 : The entry for Scheme in the Free On-Line Dictionary of Computing (courtesy of Denis Howe). Figure 2.12 is a good illustration of the expressive possibilities of hypertext on a page. Another level of expressiveness results from connecting a variety of pages. The WWW Virtual Library itself is an excellent example of a distributed collection of hypermedia information available on the Web. The WWW Virtual Library is distributed on many servers, and individual pages in it are maintained by experts in the field represented. Web Space Reference Master list  http://www.w3.org/hypertext/DataSources/WWW/Servers.html or Virtual Tourist I at http://www.vtourist.com/ Subject tree  http://www.yahoo.com/ (many others-see Chapter 1) Keyword searcher  http://www.lycos.com/ (many others-see Chapter 1) Communication The Web is essentially a communications medium, making it possible for organizations, individuals, and groups to connect in a variety of ways. The applications discussed in the other chapters of this book reflect this function of the Web as a communications tool. This section, however, focuses on Web communication in detail, presenting applications in various contexts: individual, group, organizational, mass publishing, and specialized areas such as scientific, community, and real-time information. These examples illustrate the flexibility of the Web as well as the ingenuity of people who mold and use it to fit their needs. The communication categories-individual, group, and mass-are useful guidelines to the scope of the communication contexts discussed here, but these categories aren't necessarily clearly demarcated on the Web. Although traditional notions, such as what distinguishes a mass publication from an individual one, shape expectations about Web information, the Web itself can blur or break these expectations. An individual's home page might attract a larger audience than a "mass" publication such as an on-line magazine or newspaper. Similarly, the boundaries of Web organizations can blur. Although organizations can create very specialized information spaces, their members often collaborate in other dynamic communities, and their multiorganizational participation (and cross-linked information) alters what can be considered the boundary of one organization's Web and another's. Individual Communication: Home Pages The practice of having a personal home page is only a tradition, not a technical necessity of Web communication. A person creates a home page in the same way any other HTML page is written. The user makes a home page publicly available through a means that may vary from server to server, based on technical issues as well as administrative policy. The information found on home pages varies widely and reflects the diversity and personalities on the Web. There are no set formats and no one style or set of contents to include. Figure 2.13 shows Debbie Ridpath Ohi's home page (http://www.inkspot.com/~ohi/aboutme.html). Her page is typical in that she creates a personal information space that links to personal and professional information. She links to resources that she maintains or develops, including a list of children's writer's resources, a page of the WWW Virtual Library. Figure 2.13 : Debbie Ridpath Ohi's home page. Through home pages, the Web has an enormous potential to give people an outlet for creativity and self expression. Often, an excellent source of information in a particular subject area is the personal home page of someone studying that topic. When people create links back to groups in which they participate, the cliques and electronic tribes of the Web become apparent. Group Communication Whereas personal home pages represent the life and view of individuals, many other Webs create forums for people to communicate and form group identities. Some of the pages use a process called interactive webbing. This enables people to contribute to a common space for network-distributed hypermedia writing (refer to Fig. 2.5), although the predominant mode of group communication on the Web is the passive communication model shown in Figure 2.3. One example of a group's Web is that of the HTML Writers Guild (http://www.hwg.org/) shown in Figure 2.14. The HTML Writers Guild is an excellent example of the group system illustrated in Figure 2.3. Through a directory of members, the HTML site binds the home pages of participants together. Figure 2.14 : The HTML Writers Guild Web site (courtesy of Bill Spurlock). The HTML Writers Guild also supports information sources. Links from the front page include links to HTML development resources conference information and to the archives of the guild. The archives include transcripts of the guild's mailing list (translated to hypertext using Gerald Oskoboiny's HURL interface, described in detail in Chapter 33, "A Hypertext News Interface"). Many hundreds of groups like the HTML Writers Guild are growing on the Web. The Web fosters connections among group members as well as collaborative information and resource development. By integrating discussion in a communications forum (using a mailing list, as the HTML Writers Guild has done), the group's Web provides a powerful, integrated focus for group identity and communication. Organizational Communication In addition to small, informal, or cyberspace-only groups using the Web for communication, off-line and larger organizations (with actual physical offices!) also use the Web to communicate. The Web can fulfill many of an organization's needs for communication: to inform its members, to support and promote organizational activities, to create a sense of belonging in the organization, and to communicate to the general public and potential members what that organization is all about. The Electronic Frontier Foundation (EFF) (http://www.eff.org/) is an organization founded to address the social and legal issues resulting from computer-mediated communication and information distribution. Figure 2.15 shows the organization's home page. The EFF takes part in public education and supports litigation in the public interest. The EFF's web plays an integral role in fulfilling its mission for public education. Figure 2.15 : The Electronic Frontier Foundation Web site (courtesy of Stanton McCandlish, EFF on-line services manager, and Selena Sol, EFF on-line service coordinator). EFF's web is typical for an organization. Using a home page as an entry point, links are provided to information about EFF services and publications, to EFF officials and staff, and to related sites and resources. The EFF web thus performs many of the same functions as the HTML Writers Guild web. An important difference between the two organizations, however, is their size. EFF's membership is far too large to allow for an extensive directory of home pages, and individual participation in the EFF is not entirely focused on on-line resource development; it also focuses on off-line activism. As is typical of many large organizations with significant off-line activity, the EFF's web is just part of its identity, whereas the HTML Writers Guild web (as appropriate for its subject emphasis) is perhaps the only manifestation of it as an organization. Thousands of organizational communications systems exist on the Web. Ranging from academic Campus-Wide Information Systems (CWIS) (http://www.mit.edu:8001/people/cdemello/univ.html) to commercial sites (http://www.directory.net/), these systems use many techniques for information dissemination and communication, as exemplified by the EFF's web. Mass Communication Although all pages on the Web are potentially mass communication publications, many Web sites are purposefully developed for and intended to reach mass audience segments. With models often based on paper magazine publishing for information delivery and design, these Webs appeal to many of the same niche audiences that paper magazines try to reach (music, computers, gardening, and so on). FutureNet is part of the on-line work of Future Publishing, a successful (paper) magazine publishing enterprise in Britain. Future Publishing, like many other paper-based media enterprises, is starting to realize that paper is not the only way to reach customers. FutureNet is its Web-based project, providing access to content selected from Future Publishing's more than 37 specialist consumer magazines as well as other material prepared for the Web. Figure 2.16 shows FutureNet's Web site (http://www.futurenet.co.uk/). Figure 2.16 : FutureNet's Web site (Copyright 1995 FutureNet. Courtesy of Karl Foster). FutureNet's Web offers a wide range of content in computing, music, games, outdoors, crafts, and other consumer-interest areas. The computing section, for example, provides access to the individual magazines in that category, subscription information, and samples of content. Certain issues of some magazines are on-line in their entirety-for example, the premier issue of the British magazine .net. FutureNet is not the only Web-based attempt at magazine publishing by paper-based publishers. Time-Warner's electronic publishing Web efforts (http://www.timeinc.com/) include support pages for its paper magazine Time and the full text of its Web-based Pathfinder (http://pathfinder.com/), among others. HotWired (http://www.hotwired.com) is the Web counterpart of Wired magazine, which is very popular on paper. More Web-based publishing information is in Yahoo!'s (http://www.yahoo.com/) Business-Corporations-Publishing and Business-Corporations-Magazines sections. Mass communication also can be performed in real time on the Web. Atlantic Records (http://www.atlantic-records.com), for example, broadcast the appearance of Tori Amos (http://www.tori.com/) at the Virgin Atlantic record store in Times Square on May 13, 1996. The event was broadcast on the Internet, and anyone could view and hear it through a Java-enabled browser. This kind of broadcast is possible with other Internet technologies (MBONE-Multicast backbone), but the use of Java for the broadcast client makes it easy for anyone with a Java-enabled browser and an Internet connection to tune in. Community Communication Another variation on audience size and purpose in Web information delivery involves community-based information systems. A variety of FreeNets around the world support community information access. Other Web-based information systems also are available that support geographic-based communities. A good example of this is Blacksburg Electronic Village (BEV) in Blacksburg, Virginia (http://www.bev.net/), shown in Figure 2.17. Figure 2.17 : The Blacksburg Electronic Village welcome page. BEV is a cooperative effort to create a comprehensive information infrastructure to support an entire community. By using the strength and talents of the partners in the program (Virginia Tech, Bell Atlantic, and the Town of Blacksburg, Virginia), the project attempts to create a critical mass of users so that people can and will use electronic means to interact and gather information. As an electronic village that reflects the activities of a real community, the offerings on the BEV Web include features that you would expect to find in a community, such as links covering aspects of education, health, government, and cultural activities, as well as support information for using the BEV Web. The Community Square, for example, provides links to local attractions and activities, such as a restaurant guide, local organizations, and general-interest information. In the Village Mall area, a user can find the weekly specials, look at the menu of restaurants (such as Backstreets), and even obtain a coupon for specials on pizza and calzone from the Backstreets home page. Scientific Communication Because the Web was invented by scientists at CERN (http://www.cern.ch/), it's no surprise that the scientific community is very active on the Web. The Web's power to integrate large amounts of information is part of its appeal as a medium for distributing scientific information; hypertext can be used to create layers of detail, allowing a variety of audiences to use the information. A good example of scientific communication on the Web is the technical detail offered in the many Web sites of the U.S. National Aeronautics and Space Administration (NASA) (http://www.nasa.gov/). A specific example illustrating a rich source of scientific information is NASA's presentation of International Space Station (ISS), which the United States, along with other countries (in Europe, Canada, and Russia), is developing. Large space vehicles are extremely complex, and the ISS is particularly complex, involving multinational participation. NASA's web about ISS represents a depth of scientific and technical communication delivered on the Web. Figure 2.18 shows the program overview page of the ISS project, with links to the multimedia information available about the station (http://issa-www.jsc.nasa.gov/ss/). Figure 2.18 : The International Space Station program overview (courtesy of the Jobnson Space Center). In addition to overview information, the ISS web offers detailed technical information about the station's plans and components. The ISS Technical Data Book (http://issa-www.jsc.nasa.gov/ss/techdata/techdata.html) includes technical data on systems and subsystems, as well as the assembly sequence by flight (see Fig. 2.19). Each cell in the matrix in Figure 2.19 leads to further technical specifications. Figure 2.20 shows the Functional Utility Interconnect Diagram (FUID) subsystem page for flight 1A, for example. Figure 2.19 : The ISS Technical Data Book (courtesy of the Johnson Space Center). Figure 2.20 : The ISS Flight IA Functional Utility Interconnect Diagram page (courtesy of the Johnson Space Center). The depth of information the ISS Web illustrates is just a glimpse of the wealth of scientific and technical communication already available on the Web. For more examples, see http://www.december.com/cmc/info/applications-communication-scientific.html. Real-Time Surveillance Although most of the delivered information on the Web is fairly static, some information available through the Web is presented in real time. Web interfaces for a variety of surveillance cameras and other remote sensing (and manipulation) devices are available. Check in Yahoo! (http://www.yahoo.com/) for the phrase "interesting devices connected to the net." One useful (nearly) real-time service provides the current weather conditions. Weather reports have long been available over the Internet, mostly through text interfaces or FTP interfaces. With the widespread development of graphical Web browsers, current weather imagery-satellite cloud cover images, forecast maps, and digital radar summaries-now is available on the Web. Charles Henrich at Michigan State University developed the Interactive Weather Browser (http://rs560.cl.msu.edu/weather/interactive.html), which weaves together many existing weather data sources into an easy-to-use Web interface. Figure 2.21 shows the conditions in the United States as obtained through the Interactive Weather Browser. Figure 2.21 : Interactive Weather Browser current conditions in the United States (courtesy of Charles Henrich). The Interactive Weather Browser enables a user to view the Current Conditions map and to obtain a National Weather Service forecast for a weather station by entering the station's name or by clicking the Current Conditions map. Although these weather services are offered in different ways in other areas of the Net and Web, Charles Henrich's Weather Browser brings these together in an easy-to-use forms interface. As a result, the user can access the remote-sensing devices available to the National Weather Service through the Web and achieve (nearly) real-time communication about real-world conditions. Real-Time Communication Another option is to enable communications in real time using Java. HotWired (http://www.hotwired.com/) has done this with its public chat rooms. Figure 2.22 shows the Java interface with a discussion in HotWired's Club Wired. Figure 2.22 : A Java chat room in HotWired (courtesy of Wired Ventures, Ltd.). Interaction As shown in Figures 2.2 and 2.4, there is a difference between user selectivity and interactivity. Through creative use of hypertext, designers present many choices for encountering information; this enables users to be selective about the path they take through this information. Another way to involve the user in information-shaping exists, however: interactivity. Gateway programming (see Part IV) is the key to building interactivity into Webs. Examples of excellent interactivity still are relatively rare on the Web when compared to the thousands of Web sites that use one-way information delivery. This section highlights some examples of interactivity in communication, information gathering, and computation. Interactive Communication Although the passive group communication shown in Figure 2.3 is one way to foster group collaboration and communication (the HTML Writers Guild, for example), forms of interactive communication in which users can alter or add to an existing Web structure (refer to Fig. 2.5) are powerful ways to create more dynamic group communication. Figure 2.23 : The Web Chat interface and a sample message. Conferencing on the Web is just in its initial phases. Systems such as Web Interactive Talk (WIT) (http://www.w3.org/hypertext/WWW/WIT/User/Overview.html) offer a way for users to contribute to and create threads of discussion based on a system of areas and topics. Developed by Ari Luotonen and Tim Berners-Lee after the first international conference on the Web in 1994, WIT offers a very basic method to create a discussion space on pages of the Web as alternatives to the transitory discussion spaces in unarchived Usenet or mailing list discussions, where topics are raised repeatedly. Another way to implement discussion on the Web is by using WebChat (http://chat.acmeweb.com/) and the Internet Round Table (http://www.irsociety.com/). WebChat space includes several rooms in which people can post messages and possibly icons. Figure 2.23 shows the interface to WebChat. The buttons at the bottom of the screen provide the user with more information about the application. The top of Figure 2.23 shows a sample message posted to the C Lounge: "Hello people of the C Lounge," which was posted by entering the text in the box below the CHAT button and a URL for an icon in the Your Picture URL box on the interface. After the CHAT button was clicked, the message appeared in the Coffee House room for everyone in that room to see (or anyone visiting that room afterward). This WebChat system creates a text that is somewhat more permanent than other kinds of real-time, text-based chat systems such as Multiple User Dialogues or variants (MU*s) or Internet Relay Chat (IRC). Other variations exist on the WebChat model. You can find other WebChat sites at http://www.irsociety.com/webchat/hotlist.html, for example. Interactive Information Just as WebChat brought an interactivity dimension to hypertext, interactivity can be brought to Web-delivered (and gathered) information. The key to this interactivity is that information is transferred from the user to the Web master based on customized user selections, and that this communication can happen in either direction. The user may supply a set of information that then is sent to a Web master and entered into a database or other Web structure (such as the WebChat dialogue lines posted to hypertext pages), for example. Alternatively, the Web application may pass customized or tailored information back to the user as a result of the user's selections or input. The graphical information maps illustrated in the ISS Technical Data Book in Figure 2.19 are similar but are not truly interactive. Each pixel of a graphical information map serves as a switch that may connect a user to a resource on the Web. In this way, graphical information maps are an extension of user selectivity and information delivery. Interactivity in information delivery requires more user involvement or a customized response from the application to the user. The Internet Movie Database (IMDB) (http://www.imdb.com/) is a good example of both distributed hypertext used for information delivery and forms as a way to interactively elicit additions from users. The IMDB was compiled by an international team of volunteers coordinating their work through the rec.arts.movies Usenet newsgroup. Figure 2.24 shows a sample entry for A Very Brady Sequel. The entry shows the excellent way that hypertext has been used in the database. Each underlined word in the figure is a link to further information. Figure 2.24 : An Internet Movie Database entry for A very Brady Sequel (courtesy of the Internet Movie Database Team). This information includes links to other movies that the producing company (Paramount) has created, links to reviews of the movie's technical information, ratings provided by users of the database, a list of the songs in the soundtrack, and a list of cast members. Each cast member's name is cross-indexed with other films in which they appeared. Figure 2.25 shows Shelley Long's (Carol Brady's) filmography, for example. Figure 2.25 : Shelley Long's film credits (courtesy of the Internet Movie Database Team). How does all this intricate information get into this database? The answer lies in the Add Some New Data button, which is similar to the Add Some New Information button (titles and/or biographical information) on the Shelly Long page in Figure 2.25. Figure 2.26 shows the form used to solicit suggested information from users. Figure 2.26 : The Internet Movie Databae addition form (courtesy of the Internet Movie Database Team). After filling out new information in one or more fields in the form in Figure 2.26, the user can send the information, formatted correctly for the IMDB, to the database managers for processing and inclusion in the database. The IMDB does not allow for automatic updating of information, but its interactive solicitation methods help gather information from users. Whereas the IMDB elicits information that flows from the users to the information provider's server, other kinds of interactive information go the other way-providing customized information to users based on their requests. One example is FedEx's (FACE="Courier">http://www.fedex.com/) package-tracking system. Based on a similar system available over the telephone, FedEx offers its customers a way to monitor their FedEx shipments through the Web. Figure 2.27 shows the interface. By entering the airbill number in the entry box, the user can get a report such as the one shown in Figure 2.28. Figure 2.27 : A FedEx, Web-based, package-tracking system (courtesy of Federal Express Corporation). Figure 2.28 : A FedEx package-tracking report (courtesy of Federal Express Corporation). Figure 2.29 : A chemical model in Java. You also can accomplish three-dimensional display by using Virtual Realty Model Language (see Chapter 28, "Virtual Reality Modeling Language"). Computation In addition to providing information and communication interactivity, the Web offers remote computation through gateway programming techniques. Figure 2.30 shows a simple example of this capability: a mortgage calculator (http://www.internet-is.com/homeowners/calculator.html), courtesy of HomeOwners Finance Center (http://www.internet-is.com/homeowners/index.html). Figure 2.30 : The HomeOwners Mortage Calculator (courtesy of HomeOwners Finance and Internet Information Systems). The user enters the principal loan amount (for example, $120,000), the duration in years (15 years), and the interest rate (8.75). The calculator then shows the payments, the principal, and the interest breakdown for the first month, as shown in Figure 2.31. This is an extremely simple calculation (it easily could be done on a pocket calculator), but it's just an indicator of the computational resource possibilities the Web offers. Figure 2.31 : The HomeOwners Mortage Calculator results (courtesy of HomeOwners Finance and Internet Information Systems). Computation also is possible in Java. Because it is a programming language, Java can be used by a developer to perform mathematical calculations. The benefit of Java is that the results can be displayed in real time, as the financial portfolio in Figure 2.32 shows. Figure 2.32 : The Java Financial Portfolio Page. Web Development Phases The examples in this chapter demonstrate the power of the Web to function for information delivery, communication in many contexts, interactivity, and computation. Another way to approach the potential of the Web is to examine applications demonstrating excellence in Web-development processes. Part II, "Web-Development Processes," covers all the processes: planning, analysis, design, implementation, development, promotion, and maintenance. This section presents specific examples that show excellence in web design and implementation so that you can see the possibilities for web expression. Design Web design is the process of creating a look and feel as well as developing a linking and information packaging architecture for a web. Web design is truly an art that balances aesthetics with technical considerations and communications principles. Chapter 7, "Web Design," covers the design process of web development in detail. This section examines a particular web that displays excellent design: the web of vivid studios. vivid studios is an interactive multimedia and software products company based in "Multimedia Gulch" on San Francisco's Third Street. The vivid studios web reflects its design sensibility and conveys a rich set of information about its activities and offerings. Figure 2.33 shows its home page (http://www.vivid.com/). Figure 2.33 : The vivid studios home page (copyright vivid studios, http://www.vivid.com; courtesy of Drue Miller). All pages of the vivid studios web have the same look and feel. Each has graphical header and footer links, which offer the same navigational choices to the user. Each banner graphic is expressive but very easy to download (it doesn't require a great deal of time to download in comparison with many other graphics on the Web). The colors and icons work well together and give a tactile sense to the information. The colors aren't blaring or gaudy (another frequent design problem on the Web) but are muted and subtle, gaining the user's attention through functionality. The icons and text guide the user through the information in the vivid web instead of acting merely as decoration. The cohesive, consistent page design, marked by the banner graphic at the top of each page, also is functional. The graphic banner is a clickable information map, allowing the user to make navigation selections for other pages of the vivid web from any page. The footer bar of each page includes the same selections available in the graphical map in text. This allows nongraphical browsers to use the site. Figure 2.34 shows the result of clicking the Ground Zero icon (the Earth) in the banner graphic at the top of the page. Figure 2.34 : The vivid studios Ground Zero page (copyright vivid studios, http://www.vivid.com; courtesy of Drue Miller). Once at ground zero, the graphic banner at the top of the page has GROUND ZERO in its background and the same icons in the foreground. Not shown in the black-and-white renderings of these pages is the difference between the icons' appearance in Figure 2.33 versus 2.34. In Figure 2.33, all the icons are shown in full (colored) shading. In Figure 2.34, only the Earth icon (for ground zero) is shown with color shading; the rest of the icons are muted. In this way, the designers have used the graphical banner very effectively to cue the users to their location within the information structure of the web. Figure 2.35 shows the home page of vivid studios' "Wordsmith and Webmistress," Drue Miller. Her home page illustrates both the graphic header and the links in the footer. The naming of each category also follows a creative, metaphorical style; instead of listing the home pages of the members of the vivid team in a link such as People Page, the term grey matter is more creative and metaphorical, conveying the designers' sensibilities and the creativity of vivid studios. Figure 2.35 : Drue Miller's page (copyright vivid studios, http://www.vivid.com; courtesy of Drue Miller). Excellence in design is crucial for the success of any web. Without a design that efficiently presents choices to the user, the information in a web easily can be lost. In the vast extent of Web space, there is much poor design, even greater mediocre design, and a few, rare glimmers of elegant and effective design such as in vivid studios' web. Web developers, therefore, can look to design as an area in which they easily can gain a high degree of advantage over their competitors through excellence. Implementation Design is a crucial process for developing a web, and so is excellent implementation. Implementation is the process of taking a design and creating and managing the HTML and other multimedia files that implement the working web. Implementing even a modest-sized web of just 50 to 100 files can be a daunting task. Many examples exist, however, of large webs that have been implemented very well. NASA's Space Shuttle Technical Manual, which is hosted on the Kennedy Space Center web (http://www.ksc.nasa.gov/), is an excellent example of a good implementation of a very complicated web. Figure 2.36 shows the front page of the Space Shuttle Technical Manual. Notice that every section and subsection of the manual includes a link directly to where it occurs in the documentation. This wall of blue style (named so because of the many hypertext links shown in blue on the page) of design may be considered to be poor design in other contexts; however, in this case, this linked list provides the user with one-jump entry points to all the sections of the technical manual.] Figure 2.36 : The Space Shuttle Technical Manual front page (courtesy of Kennedy Space Center). The text within the body of the manual is a blend of hyperlinks and flat text, as Figure 2.37 shows. The hyperlinks connect the user to further terms and information. Hundreds of terms are defined within the text, and each time a defined term appears, a hotspot links the term to its definition or explanation. This same implementation technique used in other contexts on the Web could be correctly considered to be link overkill and a major implementation flaw. In this technical manual, however, the order in which a user might encounter information is not known. As a result, the hypertext implementer can't assume that the user has read any necessary background for a word or term. By making the links to defined terms everywhere, the hypertext user has access to necessary information. A sophisticated hypertext user, working with a browser that "remembers" which links it followed, can work very effectively with such an implementation. Figure 2.37 : Space Shuttle Technical Manual interior text (courtesy of Kennedy Space Center). The Space Shuttle Technical Manual is just one of many thousands of intricate technical documents presented on the Web. Its implementation as hypertext demonstrates the power of the medium to convey complex information and an implementation that allows users to selectively follow paths through hypertext to meet their needs. Other processes are important in web development-planning, analysis, promotion, and maintenance; these are covered in detail in Part II. Developer's Tour Check The Web offers a wide range of possibilities for information delivery, communication, interaction, and computation. Exemplary applications often exhibit development processes in design and implementation that meet user needs. The Web functions as an information-delivery mechanism. Web browsers give a user views into information servers, such as FTP, Gopher, and Telnet. Hypermedia presentations on the Web can expressively integrate information from a variety of protocols. The Web fosters communication in individual, group, organizational, mass, community, scientific, and real-time contexts. The Web allows for interactive communication in which participants can alter the structure or contents of a Web site using methods for interactive webbing. Forms can be used to elicit information from users and can be tied to Common Gateway Interface (CGI) programs. Also, Java executable programs, called applets, can be associated with Web pages. The Web can be used as a database interface or as an interface to software for computation. Based on input, a Web interface can return a customized response to the user. The Web's development processes offer opportunities to stretch the Web's expressive potential. Design excellence results from consistency and functionality in visual presentation and linking style. Implementation excellence is based on crafting hypertext so that it will meet the needs of the user.