Website Design

For Information Technology Professionals

Tom Worthington FACS HML

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


  1. Introduction
  2. WebML: modeling language for designing Web sites
  3. Guidelines for Site Design
  4. SOCOG Olympic Web Site and the Disabled
  5. The Web on Small Screen: I-mode phones and Interactive TV
  6. 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 Discipline of Web Site Design

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.

What is the World Wide Web?

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:
  1. A uniform naming scheme for locating resources on the Web (e.g., URIs).
  2. Protocols, for access to named resources over the Web (e.g., HTTP).
  3. Hypertext, for easy navigation among resources (e.g., HTML).
W3C (1999)

The web can be summarized as:


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 ACS Core Body of Knowledge

The Australian Computer Society divides the aspects of IT into:

Areas of Knowledge

  1. Computer Organisation and Architecture
  2. Conceptual Modelling
  3. Database Management
  4. Data Communications and Networks
  5. Data Structures and Algorithms
  6. Discrete Mathematics
  7. Ethics/Social Implications/Professional Practice
  8. Interpersonal Communications
  9. Program Design and Implementation
  10. Project Management and Quality assurance
  11. Information Security
  12. Software Engineering and Methodologies
  13. Systems Analysis and Design
  14. 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:

Web Design

Some technologies used with the web are:

Designing Navigation Systems: Examples

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.

Building Context

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.

Conceptual Design

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.

An example of an attempt to develop web site modeling is WebML (Ceri et al 2000), of which the entity-relationship modeling section will be discussed in detail later.

Structure Charts and Site Maps

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.

Site Map as a Graphic:

Site map for Australian Heritage Commission web site

From: Site map for Australian Heritage Commission web site, Australian Heritage Commission, 1999

Site map as text:

From: EdNA Online - Sitemap, Education Network, 2001

Worthington Methodology for Quick Web Site Design

The design is based of a paper book provides a familiar hierarchical structure for a web site:


Web Site


Splash Page

Front Matter, Foreword, Preface

Home Page, About Page, FAQs, Contacts

Table of Contents

Main Menu



Back Matter, Bibliography, Index

Other Sites, Index Search

To quickly turn a conventional book or report into a web site:

  1. Obtain an electronic copy of the approved, typeset document.
  2. Save the document in web format.
  3. 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.
  4. Resize or delete excessively large graphics.
  5. Separate content into web pages: cover page to "splash page", table of contents to home page, chapters to web pages.
  6. Add extra navigation, such as a replacement for the paper index, some hypertext and sub-menus.
  7. Coalesce some pages and edit some content. For example condense part of the introduction onto the home page.
  8. 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.

Examples of quick sites:

Public web sites need publicity to attract readers. The content of the site can be summarised and converted to announcements and presentations.

Next: WebML: modeling language for designing Web sites

See also:

This document is Version 2.1 - 23 June 2003:

Modified from the 2002 notes.

Comments and corrections to:

Copyright © Tom Worthington 2002-2003.