For Information Technology Professionals
Visiting Fellow, Department of Computer Science, the Australian National University, and Director of Publications for the Australian Computer Society and Director Tomw Communications Pty Ltd.
For Internet, Intranet, and Document Systems (COMP3400), May 2003
Note: New Version now available
- The Discipline of Web Site Design
- Elements of Web Site Design
- Worthington Methodology for Quick Web Site Design
- WebML: modeling language for designing Web sites
- Guidelines for Site Design
Olympic Web Site and the Disabled
- For slides see: Olympic Failure: A Case for Making the Web Accessible, Internet Society Conference, 8 June 2001, Stockholm.
- The Web on Small Screen: I-mode phones and Interactive TV
- Postscript: Emergency Web Site Design (ACT Bush Fire Emergency), 23 January 2003
The World Wide Web (Web) is a computer application which has become very popular. It provides a network of information resources, a uniform naming scheme for locating the resources, protocols for accessing them and hypertext navigation among the resources. Information technology professionals have decades of experience with computers and telecommunications. As web sites become larger and more complex, IT professionals can contribute their experience into how to build such systems.
The information architect of a large, complex web site should be two things: someone who can think as an outsider and be sensitive to the needs of the site's users, and at the same time is enough of an insider to understand the site's sponsoring organization, its mission, goals, content, audiences, and inner workings. In terms of disciplinary background, the information architect should combine the generalist's ability to understand the perspectives of other disciplines with specialized skills in visualizing, organizing, and labeling information.Rosenfeld & Morville (1998)
Rosenfeld & Morville (1998) argue that information architecture is a new field, not clearly part of an existing discipline. However, people have been designing information systems for electronic digital computers for about 50 years. The Australian Computer Society defines Information Technology as:
"the development and application of computers and communications-based technologies for processing, presenting and managing data and information" (ACS 1997).
After being involved in pioneering many early web sites, IT professionals have tended to be relegated to a technical support role in web site development. This can cause problems as the scale of web sites and their increasing functionality exceed the design skills of graphic designers, librarians, journalists and marketers. To be able to design web software and assist in the design of large scale web projects, IT professionals need to adapt their skills and learn some new web design skills.
There is no formal definition of what the World Wide Web (Web) is. However, the World Wide Web Consortium (W3C), which develops web specifications, describes it as:
... a network of information resources. The Web relies on three mechanisms to make these resources readily available to the widest possible audience:
- A uniform naming scheme for locating resources on the Web (e.g., URIs).
- Protocols, for access to named resources over the Web (e.g., HTTP).
- Hypertext, for easy navigation among resources (e.g., HTML).
uniform naming scheme
Table 1 Web Mechanisms
The web was built on the foundation of the existing Internet, which was built on existing information technologies. Many of the challenges which look new to web site developers were faced by IT developers decades before the Internet or the web existed. IT professionals can use the experience learn from the past to add new features, such as support for mobile devices and interactive television (iTV), to the web.
The Australian Computer Society divides the aspects of IT into:
- Computer Organisation and Architecture
- Conceptual Modelling
- Database Management
- Data Communications and Networks
- Data Structures and Algorithms
- Discrete Mathematics
- Ethics/Social Implications/Professional Practice
- Interpersonal Communications
- Program Design and Implementation
- Project Management and Quality assurance
- Information Security
- Software Engineering and Methodologies
- Systems Analysis and Design
- Systems Software
From Core Body of Knowledge for Information Technology Professionals (ACS 1997)
The major challenge in IT is to discover what the client wants, what might achieve that need, to reliably build a system to meet the need and then ensure the system operates into the future. As web sites become larger and more complex the Body of Knowledge built up for IT can be applied to the web. Some examples:
- Computer Organisation and Architecture: High volume web sites test the limits of available hardware. A study of the principles of operation of the components of a computer system allow a design to be optimized to meet performance requirements. Mobile and iTV web devices and embedded systems in set-top boxes have limited capacity, requiring an appreciation of how the hardware will affect the development of web systems. How to design web pages for mobile and iTV devices will be discussed in detail later.
- Conceptual Modelling: A major problem with the development of ever larger web sites is the lack of tools to deal with the complexity of design. Conceptual modelling provides tools for abstraction to find patterns in the problem and simplify design. One example is entity relationship models, originally developed for database design. How these models can be used for the design of the web site structure will be discussed in detail later.
- Data Communications and Networks: Large web sites impose significant loads on a network. A large site may need to be spread geographically to balance load and the different characteristics of internal LAN and wide area networks must be considered. The security requirements of the web site need to mesh with those of the underlying network. How to design web pages to adapt to available bandwidth will be discussed.
- Ethics/Social Implications/Professional Practice: The design of web sites involves legal, social and ethical issues of a magnitude not seen before in IT. The newness of the Internet and the public visibility of web sites create major problems for web site design. Whereas these issues might have come up a few times in the career of an IT professional, with the web they will occur in almost every project. The requirements for the design of web sites for the disabled will be discussed in detail.
Some technologies used with the web are:
The use of a hierarchy of web links is a
convention imposed by the designer for the convenience of the
reader. Links can be from anywhere in and web page to any other. In
practice this freedom can lead to confusion for the reader and is
generally used for supplementary links. An example of good use of
hypertext is in the Government On-line Strategy. The text of the
document contains hypertext links to other government reports. The
links are added to what is otherwise a conventional printed
The Prime Minister’s December 1997 policy statement Investing for Growth outlined the importance of the information age for national prosperity ... From GovernmentOnline - The Commonwealth Government’s Strategy, NOIE, April 2000, URL (archive copy): http://www.govonline.gov.au/projects/strategy/
- Database: Rather than use web pages and links which are statically created, much as paper documents, web pages can be generated from a database. Relational databases are generally used to hold the web site content. Templates with the structure of standard page designs are used to give the design for a particular site. Content is then filled into the templates in response to user requests. While in theory each page could look radically different (and different each time read), in practice a structure similar to statics pages is used, to avoid confusing the reader. An example of a database generated web site is the Australian Governments' Business Entry Point.
- Programmatic: Advanced web features, such as XML and cascading style sheets, can be used to provide a look more like that of a computer application than a document. Programming languages, such as Java, can be used to provide an interface similar to a computer game. However, a complex interface design can impede use of the web site, rather than improve it. In most cases the programming features are used to supplement a conventional document design. An example is the St George Java based Internet banking system.
- Building Context: Commonwealth Government Entry Point and Department of Defence.
- Remote Navigation Elements: EdNA site map, search facility.
Browser Navigation Features
Commonly used conventions for web navigation have been established by popular browser programs. Some applications, such as micro-browsers embedded in appliances, may justify not using these navigation conventions. Also it is possible to switch off or override some browser controls for some applications, such as public web kiosks. However, for most web site design it should be assumed that the conventions will be worked with.This also assists where additional hardware or software is used to provide access for the disabled.
Readers can get lost as to which web site they are in and where they are. The navigation system can provide clues as to where the user is and was. Examples are a navigation bar across all web pages or a fixed menu frame in a multi-frame site. Examples are the fixed top and bottom menus on the the Commonwealth Government Entry Point and the fixed left frame on the Department of Defence home page.
Remote Navigation Elements
With most web sites based on a paper book model, it is natural to include a title page (or "splash page"), table of contents, a site map (detailed table of contents) and an index. In some designs the site map doubles as a more accessible table of contents. Few sites have an index, but instead have a search facility. A search facility provides less context for the reader than an index, as the search finds what is there, not what else may be near it.
EdNA (The Education Network Australia) has a "splash page" which appears for a few seconds before the contents page loads. The site map uses a simple design with headings from the contents page and then one level of details. A confusingly powerful search facility is provided.
High-Level Architecture Blueprints: No widely accepted modeling or diagramming techniques exist for web site design. IT professionals can adapt Conceptual Modeling methods, such as those used for relational data and Software Engineering Methodologies used for requirements analysis functional and technical specifications process, data and object orientation models.
Lengel (2002) describes the use of Structure Flow Charts in chapter one as an aid to designing a web site. In chapter two they describe the use of site maps to describe the web site for the user and comment "the flow chart you developed for your site in chapter one is a site map". In practice site maps rarely use graphics and are indented text instead. Also the use of the term "flow chart" does not match that of computer science, where a flow chart show the flow of control in a computer program, not the structure of the data or software.
From: Site map for Australian Heritage Commission web site, Australian Heritage Commission, 1999
From: EdNA Online - Sitemap, Education Network, 2001
- About Us
- EdNA Online Policies
- Content Standards (Schools)
- Usage of Collaborative Tools
- EdNA Online Principles
- Publishing Guidelines
- News & Views Guidelines for Contributors
- Terms and Conditions
- Suggest a Site
- Admin Access
Front Matter, Foreword, Preface
Home Page, About Page, FAQs, Contacts
Table of Contents
Back Matter, Bibliography, Index
Other Sites, Index Search
- Obtain an electronic copy of the approved, typeset document.
- Save the document in web format.
- Replace presentational markup with structural markup and style properties. For example replace explicit font sizes and colors with standard heading level codes (such as <H3>) and styles. The Tidy program assists with this.
- Resize or delete excessively large graphics.
- Separate content into web pages: cover page to "splash page", table of contents to home page, chapters to web pages.
- Add extra navigation, such as a replacement for the paper index, some hypertext and sub-menus.
- Coalesce some pages and edit some content. For example condense part of the introduction onto the home page.
- Check the document and after approval publish it on-line.
This process can reduce the production of a web site from months or weeks to a few hours. If there is time later, graphics and additional styling can be added to enhance the look of the site.
- Special Broadcasting Service web site: prepared from an A4 brochure overnight and launched the next day,
- Architecture For Access To Government Information, Information Management Steering Committee Technical Group, Office of Government Information Technology, 1996: a Government report reformatted for the web,
- Universal Service? - Telecommunications Policy In Australia and People with Disabilities by Michael J Bourk, 2000, ISBN 0 646 39159 3: A book reformatted for PDF and the web.
This document is Version 2.1 - 23 June 2003: http://www.tomw.net.au/2003/wd.html
Modified from the 2002 notes.
Comments and corrections to: email@example.com
Copyright © Tom Worthington 2002-2003.