Web-based Application

Use when

The site is for 'doing' things rather than finding information. Users can perform complex tasks such as reading and writing emails, placing orders, managing a bank-account. In most cases there are 'objects' involved that belong to the users which the users need to create, change, delete or update. A web-based application is an application that could just as well be a normal application. It now just runs in a web browser.

How

Web-based applications are based on Views for showing the objects and Form for changing them. The view provides a "safe" place where the users always return to after doing something using a Form or Wizard. The views are usually lists or tables that allow the display of information to be controlled. For example, using a Table Sorter or Table Filter. When tables are being used, consider Alternating Row Colors for making them better scannable. In applications such as a Content Management System, Tree controls are also widely used.

Web-based applications are often personal and therefore require users to Login. The information shown and the functionality that is accessible will depend on the user's identity or 'role'. That also means that not every users will see the same views or data per view. In some cases, users can use a demo account to see what the application looks like before commencing Registration.

Since web-based applications can be quite complex there is often help information or a Frequently Asked Questions (FAQ) as part of Meta Navigation. Other elements in the meta navigation are often 'logout', 'home', 'feedback' and so on.

A web-based application usually has a simple navigation mechanism that allows users to switch between views. A simple horizontal/vertical menu or Double Tab Navigation will usually suffice. The views are labeled based on the objects rather than the actions. The actions will be present in the view itself. However, in practice, some actions such as "compose email" are so important that they will be part of the navigation as well.

Why

Views contain the objects of interest and the view should therefore also be label according to the objects rather than the actions. Structuring the web-based application mainly on views makes it easy for users to understand what they can do and how to interact with it.

More Examples

This is an example of a Dutch online banking application. A simple horizontal menu with Fly-out Menu is used. The main actions are done using Form such as this one:


This example is from OpenCMS, an open source CMS. It uses many types of views that each show a different aspect of the website: