Dynamic Web Pages

Dynamic Web pages were first introduced in 1995 with the creation of JavaScript, originally dubbed LiveScript (Benson, 1999, p. 25) by Netscape in an effort to facilitate interaction on the Web. Since then, multiple techniques of delivering interactive content and functionality have been utilized. Some of the common scripting languages used for such purposes are client-side JavaScript by itself or a server-side scripting language, such as PHP, Perl, and ColdFusion, in combination with a database. An alternative approach to scripting languages has presented itself in Flash, which prepackages the scripted actions into a new file format. With the many technological choices comes a variety in specific implementations; hence the need for standards to ensure accessibility and usability.

• Standards

Standards for dynamic Web pages exist at a crossroads of concerns related to Web content and to software development. The code cannot be validated as with static content and the integrity of the supported interaction needs to be maintained, while anticipating lack of availability for some users. Consequently, standards can provide useful guidelines on how to balance those conflicting goals. In lieu of standards for generating dynamic content, currently we just have the Web Content Accessibility Guidelines 1.0 (WCAG) that address dynamic content in their article 6 under the heading Ensure that pages featuring new technologies transform gracefully (W3C, 1999). All the provisions focus on how to minimize the impact of unavailability of certain technologies on the user’s machine and constitute a remedial set of rules to safeguard against malfunctioning. Meanwhile, every scripting language conforms to its standard for optimal effectiveness, such as JavaScript being standardized through the ECMAScript language specification, known as ISO/IEC 16262 (Standard ECMA-262, 1999).

• Dynamic Elements

Below you will find discussions of common dynamic elements. The list is not intended to be comprehensive and the selection of features is based largely on personal experience.

1. Navigation

Using interactive elements for navigation purposes is one of the most common uses of dynamic content on Web pages. Hierarchical tree menus are hallowed for saving screen real estate, while presenting a complex structure for navigation. One need not know a scripting language to create such a menu. Script libraries, such as Dynamic Drive ( http://www.dynamicdrive.com ) and Open Cube ( http://www.opencube.com/ ) for JavaScripts and Hot Scripts ( http://www.hotscripts.com/ ) for many languages offer an assortment of customizable scripts. In addition, Web development software packages such as Dreamweaver incorporate scripts if one is concerned with the visual rollover effects in navigation bars. The main tradeoff with interactive navigation is speed versus availability and accessibility. Server-side technologies can offer more stable functionality, while client-side technologies can offer greater speed.

1. Applications

Web applications range from the most minimal form handling that focuses on either recording or acting on user input to the most complex e-commerce check-out applications that allow for multi-step transactions. Any functionality that allows users to complete a task in a sequential manner would be considered an application. Common communication tools, such as forums, chats, and lately blogs, constitute some common examples of Web applications. The main information architecture concerns in the generation of all types of Web application would be data integrity, security, accessibility, and obviously the continuity of the task at hand. It is in the design of such applications that article 6 of the WCAG standard mentioned above can be most useful. According to Richard Roth, a software architect and the CEO of On-the-Net , some general rules to be considered are a simple user interface and flexible, clear functionality.

1. Personalization

Personalization is yet another common dynamic element. It has become popular not only in the context of Web applications where identifying the user might be necessary, but also in information services online. News pages like Yahoo News, for example, offer personalization. Even Web pages within E-Government try to offer this feature as they push toward a greater number of official citizen-government transactions on the Web. A pertinent example of this trend is the Department of Agriculture site ( http://www.usda.gov/ ). Huge sites that serve diverse audiences or provide a multitude of services stand to benefit from personalization, which offers flexibility while enhancing the burden of generating accessible dynamic content and maintaining the continuity of tasks independent of user customization.

1. Syndication

Syndication has become a popular method of adding dynamic content generated initially by other sites. It brings in both data and metadata from the Web and incorporates them seamlessly within one’s own site. It is widely used for display of news and updates. One file format for syndication is the RSS 2.0, which uses XML. It was released in 2003 through Harvard under a Creative Commons license (RSS History) and is supported by online periodicals, blogs, and other sites.

1. Animation

Finally, animation is a common dynamic element that has a somewhat dubious status because of the wide potential for abuse. It is utilized in marketing and for entertainment, but hardly ever to convey useful information. Ping Zhang of the School of Information Studies at Syracuse University illustrates, in a study, animation’s potential negative impact on meaningful interaction with a site due to distraction and visual interference with the users’ task (p. 25). Main information architecture concerns related to animation would be its interaction with other content elements, its visual effects on users, and its usefulness in conveying meaning.

• Technologies

Given the variety of features and the purposes they serve, information architects bear the responsibility of considering how those purposes can best be accomplished for a specific audience with the most appropriate choice of technology. Every project would present unique challenges and opportunities, which would ideally be considered on a case-by-case basis. Below you will see discussions of several technologies for generating dynamic Web pages, each accompanied with an analysis of advantages and disadvantages.

1. JavaScript

<HEAD>

</HEAD>

<BODY>

<FORM>

<a href=”rainbowline.gif” onMouseOver=”status=’rainbow’;return true”>See a rainbow</a>

</FORM>

</BODY>

Figure 1. JavaScript event (Tiele, 2002)

JavaScript is an interpreted cross-platform, object oriented scripting language and the version that is useful for dynamic Web pages is its client-side extension (JavaScript). JavaScript allows for direct scripting within HTML pages by embedding or integrating the script. The client-side extension of JavaScript provides the ability to control a browser and its Document Object Model, as well as to respond to user events such as mouse clicks, form input, and page navigation (JavaScript). It can not directly communicate with the server but can be used to enhance the user experience or simplify the interface (Roth). JavaScript works by using events and actions that can be combined into declarations of functions. All of those can be executed from within the HTML, see Figure 1.

Major concerns related to information architecture ensue from JavaScript’s execution on the user’s machine. This technology can be abused to send malicious code and compromise security. Also, its performance depends on every browser’s implementation of the DOM and could vary across browsers. Those limitations, however, need to be considered in the context of JavaScript’s strengths. Because it works directly on the user’s machine, JavaScript offers very fast interaction while saving bandwidth. It can act in response to the user without having to completely re-load pages. The learning curve for implementing it is very small, especially with the many downloadable scripts online that can easily be customized. Interactive features commonly implemented with JavaScript include navigation, form verification, and Web applications. Less often it is used for syndication. Weighing the strengths and weaknesses, information architects should not forget to consider closely related implementations of the ECMA-262 language specification, such as VBScript and JScript as alternatives, especially if they are concerned with support by a specific browser.

1. Flash

<object width=”550″ height=”400″>

<param name=”movie” value=”somefilename.swf”>

<embed src=”somefilename.swf” width=”550″ height=”400″>

</embed>

</object>

Figure 2. Flash in HTML (Flash Tutorial)

Another technology that enables dynamic Web pages is Flash. It offers a different approach to interaction by building it into a movie file in SWF or the Flash Player format. Many software packages can be used for the creation of Flash movies, Macromedia Flash MX being the most powerful and expensive of all. Other examples include SWiSH and FLASHtyper, as well as interactive tools on the Web. Flash achieves interaction by combining graphics, animation, sound and scripting. It uses vector graphics, which means that the graphics can be scaled to any size without losing clarity/quality (Flash Tutorial) combined with code to handle actions. Once the movie is created, it can be embedded in HTML for display, with a Flash Player being the only requirement for viewing the movie. Embedding can work differently across browsers, so the use of EMBED and OBJECT tags is recommended, see Figure 2.

Main considerations to keep in mind related to Flash have to do with the Web page’s interaction with the browser and potentially with search engines. Jakob Nielsen criticized Flash in 2000 for breaking fundamentals, such as the BACK button and text resizing, as well as offering gratuitous animation and reducing the granularity of user control. Later on, he amended his criticism as some usability features were improved (Nielsen, 2000), but there is more to be demanded from Flash, especially for whole Flash sites, which practically disable browser functions such as bookmarking, text re-sizing and the BACK button. Meanwhile, advantages to offset those limitations are the design control that can ensure standards compliance and the integration of technologies, the final result of which works well with HTML code. Common uses of Flash include animated page headings, Web site intro pages, or creative/concept animation, such as the one created by Free Range Graphics ( http://www.freerangegraphics.com/).

1. Scripting & Databases

While both JavaScript and Flash have technological requirements for the user’s machine, another approach to dynamic Web pages focuses on avoiding that by using server-side technology. This approach includes a server-side scripting language coupled with a database.

Some choices for scripting languages are PHP, Perl, and ColdFusion. PHP has become very popular because it is light-weight, open-source and was designed from the ground up to work with web pages (Gesker, 2001). Perl has been considered a very mature and viable alternative as a web-scripting language, even though it was not designed with the Web in mind and its power comes with a bigger learning curve (Gesker, 2001). Finally, ColdFusion can be efficient and easy to use, but it is proprietary and has serious hardware requirements (Gesker, 2001).

Once the choice of a scripting language has been made, the decision of which database to use must follow. Again, there are many options available, with some of the commonly used ones being Oracle and MySQL. Oracle has been a well-respected relational database because it is full of features, fast and reliable (Gesker, 2001), but it is proprietary and quite expensive at that. MySQL has been favored, especially in combination with PHP, because it is very fast, multithreaded, multiuser and robust (Gesker, 2001), in addition to being open-source.

The choice of this technological combination has both advantages and disadvantages. Some of the limitations include slower loading, especially with great amounts of data in the database. At the same time, big Web sites that contain tabular data, as is the case with e-commerce Web sites, for example, can benefit from a database, which can enable customized display of content based on user preferences and queries. Finally, this approach can ensure standards compliance and validation of the mark-up without taking away the flexibility of displaying customized, dynamic content. A server-side scripting language and a database are often used in e-commerce, blogs, online periodicals, and digital libraries.

• Conclusion

The needs for interaction on a Web page can be diverse, ranging from attention-grabbing animation and browser controls to complete customization and dynamic display of the content. Based on the purposes of a Web page, its intended audience, and the nature of the interaction required, information architects can consider different technologies. With the variety of choices, however, comes the difficulty of weighing the advantages and disadvantages of every available technology. Currently, no single approach has established itself as dominant for a specific dynamic feature, so it is entirely up to an information architect’s judgment and understanding of the projects at hand to participate in making the best choice for adding dynamic elements to a Web site. Some of the main considerations to be used in the decision-making process undoubtedly include but are not limited to accessibility, usability, hardware requirements, speed, and cost.

References

Benson, Brent W. (1999). JavaScript. ACM SIGPLAN Notices, 34 (4), 25-27.

Connolly, Dan. (2000). A Little History of the World Wide Web. World Wide Web Consortium. Retrieved on October 20, 2004, from http://www.w3.org/History.html.

Gesker, Dennis. (2001). Alternatives for Dynamic Web Development Projects. Linux Journal, 2001 (83es), Article No. 6.

Fallows, Deborah. (2004). The Internet and Daily Life. Pew Internet & American Life Project. Retrieved on October 21, 2004, from http://www.ischool.utexas.edu/~i385ef04/readings/PIP_Internet_and_Daily_Life.pdf .

Flash Tutorial. (2004). W3Schools. Retrieved on October 16, 2004, from http://www.w3schools.com/flash/default.asp

JavaScript Overview. (n.d.). Enterprise Edition Server-Side JavaScript Guide. Retrieved on October 16, 2004, from http://docs.sun.com/source/816-5930- 10/intro.htm#13092.

Nielsen, Jakob. (2000). Flash: 99% Bad. Useit.com. Retrieved on October 16, 2004, from http://www.useit.com/alertbox/20001029.html.

Roth, Richard. (n.d.). Dynamic Content for the Masses � Dynamic Web Server Functions for Non-Programmer Webmasters. On-the-Net. Retrieved on October 21, 2004, from http://www.on-the-net.com/rr/www8-remote-hosting.html.

RSS History. (2004). Technology at Harvard Law: Internet Technology Hosted by Berkman Center. Retrieved on October 20, 2004, from http://blogs.law.harvard.edu/tech/rssVersionHistory.

Standard ECMA-262: ECMAScript Language Specification. (1999). ECMA International. Retrieved on October 21, 2004, from http://www.ecma-international.org/publications/files/ECMA-ST/Ecma-262.pdf.

Thiele, James. (2002). Hands-On JavaScript: Overview. Retrieved on October 15, 2004, from http://www.eskimo.com/~jet/javascript/handson/overview.htm.

W3C. (1999). Web Content Accessibility Guidelines 1.0. World Wide Web Consortium. Retrieved on October 20, 2004, from http://www.w3.org/TR/WAI-WEBCONTENT/.

Zhang, Ping. (2000). The Effects of Animation on Information Seeking Performance on the World Wide Web: Securing Attention and Interfering with Primary Tasks? Journal of the Association for Information Systems, 1 (1), 1-28.